您的位置:

js的优秀代码04,js经典代码

本文目录一览:

求一段JS的函数代码....

1:js 字符串长度限制、判断字符长度 、js限制输入、限制不能输入、textarea 长度限制

2.:js判断汉字、判断是否汉字 、只能输入汉字

3:js判断是否输入英文、只能输入英文

4:js只能输入数字,判断数字、验证数字、检测数字、判断是否为数字、只能输入数字

5:只能输入英文字符和数字

6: js email验证 、js 判断email 、信箱/邮箱格式验证

7:js字符过滤,屏蔽关键字

8:js密码验证、判断密码

2.1: js 不为空、为空或不是对象 、判断为空 、判断不为空

2.2:比较两个表单项的值是否相同

2.3:表单只能为数字和”_”,

2.4:表单项输入数值/长度限定

2.5:中文/英文/数字/邮件地址合法性判断

2.6:限定表单项不能输入的字符

2.7表单的自符控制

2.8:form文本域的通用校验函数

1. 长度限制

script

function test()

{

if(document.a.b.value.length50)

{

alert(”不能超过50个字符!”);

document.a.b.focus();

return false;

}

}

/script

form name=a onsubmit=”return test()”

textarea name=”b” cols=”40″ wrap=”VIRTUAL” rows=”6″/textarea

input type=”submit” name=”Submit” value=”check”

/form

2. 只能是汉字

input onkeyup=”value=”/oblog/value.replace(/[^\u4E00-\u9FA5]/g,”)”

3.” 只能是英文

script language=javascript

function onlyEng()

{

if(!(event.keyCode=65event.keyCode=90))

event.returnvalue=false;

}

/script

input onkeydown=”onlyEng();”

4. 只能是数字

script language=javascript

function onlyNum()

{

if(!((event.keyCode=48event.keyCode=57)||(event.keyCode=96event.keyCode=105)))

//考虑小键盘上的数字键

event.returnvalue=false;

}

/script

input onkeydown=”onlyNum();”

5. 只能是英文字符和数字

input onkeyup=”value=”/oblog/value.replace(/[\W]/g,””) “onbeforepaste=”clipboardData.setData(’text’,clipboardData.getData(’text’).replace(/[^\d]/g,”))”

6. 验证邮箱格式

SCRIPT LANGUAGE=javascript RUNAT=Server

function isEmail(strEmail) {

if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)

return true;

else

alert(”oh”);

}

/SCRIPT

input type=text onblur=isEmail(this.value)

7. 屏蔽关键字(这里屏蔽***和****)

script language=”javascript1.2″

function test() {

if((a.b.value.indexOf (”***”) == 0)||(a.b.value.indexOf (”****”) == 0)){

alert(”:)”);

a.b.focus();

return false;}

}

/script

form name=a onsubmit=”return test()”

input type=text name=b

input type=”submit” name=”Submit” value=”check”

/form

8. 两次输入密码是否相同

FORM METHOD=POST ACTION=”"

input type=”password” id=”input1″

input type=”password” id=”input2″

input type=”button” value=”test” onclick=”check()”

/FORM

script

function check()

{

with(document.all){

if(input1.value!=input2.value)

{

alert(”false”)

input1.value = “”;

input2.value = “”;

}

else document.forms[0].submit();

}

}

/script

够了吧 :)

屏蔽右键 很酷

oncontextmenu=”return false” ondragstart=”return false” onselectstart=”return false”

加在body中

2.1 表单项不能为空

script language=”javascript”

!–

function CheckForm()

{

if (document.form.name.value.length == 0) {

alert(”请输入您姓名!”);

document.form.name.focus();

return false;

}

return true;

}

/script

2.2 比较两个表单项的值是否相同

script language=”javascript”

!–

function CheckForm()

if (document.form.PWD.value != document.form.PWD_Again.value) {

alert(”您两次输入的密码不一样!请重新输入.”);

document.ADDUser.PWD.focus();

return false;

}

return true;

}

/script

2.3 表单项只能为数字和”_”,用于电话/银行帐号验证上,可扩展到域名注册等

script language=”javascript”

!–

function isNumber(String)

{

var Letters = ”1234567890-”; //可以自己增加可输入值

var i;

var c;

if(String.charAt( 0 )==’-')

return false;

if( String.charAt( String.length - 1 ) == ’-’ )

return false;

for( i = 0; i String.length; i ++ )

{

c = String.charAt( i );

if (Letters.indexOf( c ) 0)

return false;

}

return true;

}

function CheckForm()

{

if(! isNumber(document.form.TEL.value)) {

alert(”您的电话号码不合法!”);

document.form.TEL.focus();

return false;

}

return true;

}

/script

2.4 表单项输入数值/长度限定

script language=”javascript”

!–

function CheckForm()

{

if (document.form.count.value 100 || document.form.count.value 1)

{

alert(”输入数值不能小于零大于100!”);

document.form.count.focus();

return false;

}

if (document.form.MESSAGE.value.length10)

{

alert(”输入文字小于10!”);

document.form.MESSAGE.focus();

return false;

}

return true;

}

//–

/script

2.5 中文/英文/数字/邮件地址合法性判断

SCRIPT LANGUAGE=”javascript”

!–

function isEnglish(name) //英文值检测

{

if(name.length == 0)

return false;

for(i = 0; i name.length; i++) {

if(name.charCodeAt(i) 128)

return false;

}

return true;

}

function isChinese(name) //中文值检测

{

if(name.length == 0)

return false;

for(i = 0; i name.length; i++) {

if(name.charCodeAt(i) 128)

return true;

}

return false;

}

function isMail(name) // E-mail值检测

{

if(! isEnglish(name))

return false;

i = name.indexOf(” at ”);

j = name dot lastIndexOf(” at ”);

if(i == -1)

return false;

if(i != j)

return false;

if(i == name dot length)

return false;

return true;

}

function isNumber(name) //数值检测

{

if(name.length == 0)

return false;

for(i = 0; i name.length; i++) {

if(name.charAt(i) ”0″ || name.charAt(i) ”9″)

return false;

}

return true;

}

function CheckForm()

{

if(! isMail(form.Email.value)) {

alert(”您的电子邮件不合法!”);

form.Email.focus();

return false;

}

if(! isEnglish(form.name.value)) {

alert(”英文名不合法!”);

form.name.focus();

return false;

}

if(! isChinese(form.cnname.value)) {

alert(”中文名不合法!”);

form.cnname.focus();

return false;

}

if(! isNumber(form.PublicZipCode.value)) {

alert(”邮政编码不合法!”);

form.PublicZipCode.focus();

return false;

}

return true;

}

//–

/SCRIPT

2.6 限定表单项不能输入的字符

script language=”javascript”

!–

function contain(str,charset)// 字符串包含测试函数

{

var i;

for(i=0;icharset.length;i++)

if(str.indexOf(charset.charAt(i))=0)

return true;

return false;

}

function CheckForm()

{

if ((contain(document.form.NAME.value, ”%\(\)”)) || (contain(document.form.MESSAGE.value, ”%\(\)”)))

{

alert(”输入了非法字符”);

document.form.NAME.focus();

return false;

}

return true;

}

//–

/script

1. 检查一段字符串是否全由数字组成

—————————————

script language=”Javascript”!–

function checkNum(str){return str.match(/\D/)==null}

alert(checkNum(”1232142141″))

alert(checkNum(”123214214a1″))

// –/script

2. 怎么判断是否是字符

—————————————

if (/[^\x00-\xff]/g.test(s)) alert(”含有汉字”);

else alert(”全是字符”);

3. 怎么判断是否含有汉字

—————————————

if (escape(str).indexOf(”%u”)!=-1) alert(”含有汉字”);

else alert(”全是字符”);

4. 邮箱格式验证

—————————————

//函数名:chkemail

//功能介绍:检查是否为Email Address

//参数说明:要检查的字符串

//返回值:0:不是 1:是

function chkemail(a)

{ var i=a.length;

var temp = a.indexOf(’@');

var tempd = a.indexOf(’.');

if (temp 1) {

if ((i-temp) 3){

if ((i-tempd)0){

return 1;

}

}

}

return 0;

}

5. 数字格式验证

—————————————

//函数名:fucCheckNUM

//功能介绍:检查是否为数字

//参数说明:要检查的数字

//返回值:1为是数字,0为不是数字

function fucCheckNUM(NUM)

{

var i,j,strTemp;

strTemp=”0123456789″;

if ( NUM.length== 0)

return 0

for (i=0;iNUM.length;i++)

{

j=strTemp.indexOf(NUM.charAt(i));

if (j==-1)

{

//说明有字符不是数字

return 0;

}

}

//说明是数字

return 1;

}

6. 电话号码格式验证

—————————————

//函数名:fucCheckTEL

//功能介绍:检查是否为电话号码

//参数说明:要检查的字符串

//返回值:1为是合法,0为不合法

function fucCheckTEL(TEL)

{

var i,j,strTemp;

strTemp=”0123456789-()# “;

for (i=0;iTEL.length;i++)

{

j=strTemp.indexOf(TEL.charAt(i));

if (j==-1)

{

//说明有字符不合法

return 0;

}

}

//说明合法

return 1;

}

7. 判断输入是否为中文的函数

—————————————

function ischinese(s){

var ret=true;

for(var i=0;is.length;i++)

ret=ret (s.charCodeAt(i)=10000);

return ret;

}

8. 综合的判断用户输入的合法性的函数

—————————————

script language=”javascript”

//限制输入字符的位数开始

//m是用户输入,n是要限制的位数

function issmall(m,n)

{

if ((mn) (m0))

{

return(false);

}

else

{return(true);}

}

9. 判断密码是否输入一致

—————————————

function issame(str1,str2)

{

if (str1==str2)

{return(true);}

else

{return(false);}

}

10. 判断用户名是否为数字字母下滑线

—————————————

function notchinese(str){

var reg=/[^A-Za-z0-9_]/g

if (reg.test(str)){

return (false);

}else{

return(true); }

}

2.8. form文本域的通用校验函数

—————————————

作用:检测所有必须非空的input文本,比如姓名,账号,邮件地址等等。

该校验现在只针对文本域,如果要针对form里面的其他域对象,可以改变判断条件。

使用方法:在要检测的文本域中加入title文字。文字是在提示信息,你要提示给用户的该字段的中文名。比如要检测用户名

html如下input name=”txt_1″ title=”姓名”,当然,最好用可视化工具比如dreamweaver什么的来编辑域。

如果要检测数字类型数据的话,再把域的id统一为sz.

javascript判断日期类型比较麻烦,所以就没有做日期类型校验的程序了.高手可以补充。

程序比较草,只是提供一个思路。抛砖引玉! :)

哦,对了,函数调用方法:

form onsubmit=”return dovalidate()”

function dovalidate()

{

fm=document.forms[0] //只检测一个form,如果是多个可以改变判断条件

for(i=0;ifm.length;i++)

{

//检测判断条件,根据类型不同可以修改

if(fm[i].tagName.toUpperCase()==”INPUT” fm[i].type.toUpperCase()==”TEXT” (fm[i].title!=”"))

if(fm[i].value=”/blog/=”")//

{

str_warn1=fm[i].title+”不能为空!”;

alert(str_warn1);

fm[i].focus();

return false;

}

if(fm[i].id.toUpperCase()==”SZ”)//数字校验

{

if(isNaN(fm[i].value))

{ str_warn2=fm[i].title+”格式不对”;

alert(str_warn2);

fm[i].focus();

return false;

}

}

}

return true;

}

如何写高质量的JS,Html5前端代码

首先,本人在前端开发方面有点心得,有什么不对的地方希望给出建议让我更好的进步

1.命名

在开发前必须有个命名规范来对代码统一规范团队代码结构,使代码可读性提高

2.注释

我相信每个人看别人代码时看到密密麻麻的代码结构,相信每个人都会很头疼,即使想看也会看不下去,而且很耗时间,所以注释就变得尤其得重要,注释越清楚越详细我相信代码可维护性越高,而且更容易修改维护

3.变量

在js中变量无处不在,所以这么声明变量就变得尤其得重要,首先少使用全局变量,这样会增加加载速度,从而导致项目用户体验不好

4.声明变量如果不用 var 会导致变量成为全局变量。

5.函数

函数的参数数量

函数的参数不应该超过 3 个。如果函数的参数超过 3 个,应该将一些参数进行封装。

6.函数参数传递

只传函数需要的参数。如

// 不推荐

function greet(data){

console.log('Hello, I am ' + data.name);

}

// 推荐

function greet(name){

console.log('Hello, I am ' + name);

}

7.函数的功能

一个函数只做一件事。这有助于测试和代码复用。

函数尽可能无副作用。无副作用指不修改传入的参数和全局变量。

8.减少重复代码

. 记得在某个文章中看到说,如果重复的代码出现 3 次,就应该重构重复的代码。

. 松耦合

. 一个函数只做一件事

. 缓存一些计算结果

9.避免全局变量

. 从分配置和离逻辑代码

. 不要修改不属于你的对象

. 不属于你的对象包括

. 浏览器原生对象,如 Object,Array等

DOM,如 document

BOM,如 window

类库对象

如果想拓展浏览器原生对象的功能,可以创建函数,函数中把浏览器原生对象传入。如 Underscore.js 做 的那样。

10.代码风格的统一

11.尽可能的避免代码重复

. 如何减少重复的代码呢?

. 在JS中,可以将重复的代码写成一个方法,如果是可通用的,可以写在独立的JS文件中。

. 在CSS中,则需要借助Sass,Less之类的预处理语言的Mixins的功能。将重复的部分写成一个Mixins。

12.配置和逻辑分开

. JS中,对于整个站的通用配置,写在config.js里。如果是某个js的配置,在文件的开头,用defaultParam 对象来存放可变的配置,用const来定义不可变的配置

. CSS中,依旧要借助预处理语言。对于整站的配置,定 义在_variables.scss里。对于某个具体CSS文件里,在文件开头用变量来定义

13.减少代码的副作用

1JS中,方法中的沟通尽量不要用全局变量;不要在Array之类的全局对象的原型链上添加方法;尽量不要定义全局的方法和变量:如果确实有很多变量,方法放在全局上,可以学习jQuery,将很多变量,方法放在一个全局对象上;自定义事件,事件的名称也要有命名空间。

2CSS中,要做到无副作用,难度很大。对于简单页面,一个方法是,把页面上的元素都分成一个个组件,写样式时,选择器要用组件选择器 当前元素选择器。当组件变的复杂时,组件也会包含很多子组件。然后,选择器就会越来越长。。。我的解决方案是用的BEM。

14.提高代码的可读性

. 变量,方法等的合理命名,通过名称可以知道这个大概做什么的。

. 如果则要加注释来说明一下。对于不容理解的代码加注释

. 尽可能不用魔法数字

. 对于HTML,选择合适标签

15.一个方法只做一件事

一来提高代码的复用性,二来让调试也变的更容易,三来让测试变的更容易

前端开发,如何写出优秀js代码

每位前端工程师都喜欢易理解、可扩展、易维护的代码,如何写出优秀的JavaScript代码,也是每位前端工程师的功课。如何才能写出优秀的JavaScript代码呢?

1.写代码前一定要搞清楚你要解决的问题是什么,你的方案是否能够解决问题。

2.拥有良好的命名规范,注意变量名区分大小写,允许包含字母、数字、美元符号($)和下划线,但第一个字符不允许是数字,不允许包含空格和其他标点符号。

3.多写代码注释。编写代码时的注释应当尽量全面一些,这便于自己再次浏览代码时好理解。

4.能不使用with语句的时候尽量不要使用with语句,尽量少使用eval ,每次使用eval需要消耗大量时间。

拥有一手好代码的前端开发者,更具有大神风范,所以好代码不仅要精炼,更要易读。

js的优秀代码04,js经典代码

2022-11-24
经典的js代码收藏,完整的js代码

本文目录一览: 1、谁给我帖一段下拉选择菜单的js代码? 2、使用浏览器实现收藏功能js怎么写 3、求三个常用的js代码? 4、求一段简单的JS代码 5、Web前端工程师应该知道的经典代码 谁给我帖一

2023-12-08
js优秀代码图片,js好玩的代码

本文目录一览: 1、js代码控制图片移动 2、图片自动切换的JS代码 3、JS 显示 上传 图片 ,,高手帮我解释一下这段代码 4、求一个图片自动切换的JS代码。 5、如何用JS实现简单的图片替换 6

2023-12-08
网页js经典代码(网页的js)

本文目录一览: 1、求个简单javascript代码 谢谢,网站菜单功能 2、有关JS代码在网页中的问题,麻烦会的大鸟帮帮忙。 3、关于网页调用系统时间JS代码 4、Web前端工程师应该知道的经典代码

2023-12-08
htmljs编程笔记(html代码笔记)

本文目录一览: 1、html代码和JS代码有什么区别 2、如何在html中调用js函数 3、JavaScript学习笔记之数组基本操作示例 4、HTML5初学者笔记 5、《web前端笔记7》js字符—

2023-12-08
js代码中script,js代码中的问号是什么意思

本文目录一览: 1、javascript中script的SRC属性 2、JS代码里加载script代码,并隐藏其内容怎么弄呢? 3、使用javascript必须使script标签吗 javascrip

2023-12-08
前端网页js代码(前端页面代码)

本文目录一览: 1、前端开发,如何写出优秀js代码 2、做为一名前端开发人员,有哪些值得一读的JS代码 3、项目前端js基础代码包括哪些方面的东西?一般都怎样写? 前端开发,如何写出优秀js代码 每位

2023-12-08
js代码总结体会,js基础知识总结笔记

本文目录一览: 1、js到底难不难学? 2、JS 代码 求解释 可以详细的 说明一下 谢谢 3、浅谈js写轮播图的思路与心得 4、JavaScript与WEB前台开发课程实训总结怎么写 5、js中继承

2023-12-08
java调用js代码,java调用js代码 实例

本文目录一览: 1、如何在java中调用js方法 2、如何通过java代码调用js 3、java中怎么调用js代码 4、如何在java调用js 5、请问怎么写java调用node环境运行js代码? 如

2023-12-08
js代码整洁随笔,js代码整理

本文目录一览: 1、如何在页面让JavaScript代码原样显示,用标签不起用,js照常运行。请看问题补充 2、怎么让JS文件代码对齐 3、怎么样格式化javascript,怎么样格式化js 4、为什

2023-12-08
js开发代码(js代码编写)

本文目录一览: 1、如何编写高效的js代码 2、做为一名前端开发人员,有哪些值得一读的JS代码 3、Web前端新手应该知道的JavaScript开发技巧有哪些? 4、简单的js代码编程 5、前端开发,

2023-12-08
js高级程序设计笔记14(js高级程序设计笔记14页)

本文目录一览: 1、JavaScript高级程序设计 该怎么看 2、JavaScript学习笔记之数组基本操作示例 3、JS中有关sort以及return的问题 JavaScript高级程序设计 该怎

2023-12-08
或者js代码(js功能代码)

本文目录一览: 1、做为一名前端开发人员,有哪些值得一读的JS代码 2、js中,“并列”和“或者”关系的代码怎么写? 3、js中,并列 和 或者 关系的代码怎么写?比如:既要满足这个又要满足那个。 4

2023-12-08
js经典实例大全,js案例100讲解

本文目录一览: 1、js闭包是什么? 2、js下拉菜单,怎样更简便的实现? 3、js求和小案例 求解 4、JavaScript学习笔记之数组基本操作示例 5、JavaScript实现计算多边形质心的方

2023-12-08
js之常用代码块(js代码是什么)

本文目录一览: 1、js使用java代码块 2、javascript 语句、代码、代码块 3、js中单击按钮实现代码块功能 4、js中怎么截取不确定长度的字符串,截取后保留后面的部分 js使用java

2023-12-08
七个精典js写的游戏源码下载(js编写游戏)

本文目录一览: 1、植物大战僵尸的JS源代码 2、js编写的小游戏有哪些 3、求:手机软件源代码! 4、求任意一个90年代(甚至80年代也可)经典游戏的源代码下载地址 植物大战僵尸的JS源代码 jsp

2023-12-08
代码之神js实战,狂神javascript笔记

2022-11-25
浏览js代码的app(html的js代码)

本文目录一览: 1、android 有什么工具查看手机上的js代码布局 2、运行一个代码所需要的软件? 3、哪些JavaScript IDE最好用 4、如何在手机上查看html、css、js、PHP文

2023-12-08
经典效果js源码,源代码特效

本文目录一览: 1、问下在哪有js特效的源码那些,怎么弄? 2、看有些网站的jquery和js的效果比较好,如何能看到这些js的源码的?谢谢指教 3、用js源码做出缓动效果,关于for循环和setti

2023-12-08
js动画代码,代码实现动画

2022-11-27