javascript基本使用

1.JS对象操作语句 : with 语句的语法：　　　　　　　　　　　　
　with (对象名称){
执行语句 　　　　　　　　　　　　　　　　　　　
　 }
作用 :如果你想使用某个对象的许多属性或方法，只要在 with 语句的()中写出这个对象名称，然后在下边执行语句中直接写这个对象的属性名或方法名就OK了.



2.js 执行顺序 :
首先执行本页面的代码，被嵌套的js中再执行。然后是下层嵌套代码的执行。
嵌套方式 : document.write("<scr" + "ipt type='text/javascript' src='test.js'></scr" + "ipt>");





3.checkbox 全选

1.<script type="text/javascript " >
2.<!--
3.// 说明：Javascript 控制 CheckBox 的全选 与取消全选
4.// 整理：http://www.CodeBit.cn
5.
6.function checkAll( name )
7.{
8. var el = document.getElementsByTagName ( 'input' ) ;
9. var len = el.length ;
10. for ( var i=0 ; i<len; i++)
11. {
12. if ( ( el[ i] .type =="checkbox " ) && ( el[ i] .name ==name ) )
13. {
14. el[ i] .checked = true ;
15. }
16. }
17.}
18.function clearAll( name )
19.{
20. var el = document.getElementsByTagName ( 'input' ) ;
21. var len = el.length ;
22. for ( var i=0 ; i<len; i++)
23. {
24. if ( ( el[ i] .type =="checkbox " ) && ( el[ i] .name ==name ) )
25. {
26. el[ i] .checked = false ;
27. }
28. }
29.}
30.//-->
31.</script>






4.变量作用域:



Js代码
1.anonymousFuntion1 = function(){
2. globalvar = 'global scope'; //全局声明，因为“var”遗漏了
3. return localvar;
4.}();
5.alert(globalvar); //弹出“global scope”，因为函数中的变量是全局声明
6.
7.anonymousFuntion2 = function(){
8. var localvar = 'local scope'; //使用“var”局部声明
9. return localvar;
10.}();
11.alert(localvar); //错误 “localvar未定义”。没有全局定义localvar
anonymousFuntion1 = function(){
globalvar = 'global scope'; //全局声明，因为“var”遗漏了
return localvar;
}();
alert(globalvar); //弹出“global scope”，因为函数中的变量是全局声明

anonymousFuntion2 = function(){
var localvar = 'local scope'; //使用“var”局部声明
return localvar;
}();
alert(localvar); //错误 “localvar未定义”。没有全局定义localvar




Js代码
1.var myscope = "global";
2.function showScope(myscope){
3. return myscope; //局部作用域，即使有一个相同名字的全局变量
4.}
5.alert(showScope('local'));
6.
7.function globalScope(myscope){
8. myscope = window.myscope; //全局作用域
9. return myscope;
10.}
11.alert(globalScope(’local’));
var myscope = "global";
function showScope(myscope){
return myscope; //局部作用域，即使有一个相同名字的全局变量
}
alert(showScope('local'));

function globalScope(myscope){
myscope = window.myscope; //全局作用域
return myscope;
}
alert(globalScope(’local’));






加密网页破解:

地址栏输入



Js代码
1.javascript:s=document.documentElement.outerHTML;document.write('<---body><---/body>');document.body.innerText=s;
javascript:s=document.documentElement.outerHTML;document.write('<---body><---/body>');document.body.innerText=s;



window.οnlοad=init() 与 window.οnlοad=init 区别:

前者先执行函数 后加载BODY

后者相当于将一个函数当作变量赋值到window.onload上，会在界面加载完成后加载





js通用验证:

Js代码
1.function CheckForm(oForm)
2.{
3. var els = oForm.elements;
4. //遍历所有表元素
5. for(var i=0;i<els.length;i++)
6. {
7. //是否需要验证
8. if(els[i].check)
9. {
10. //取得验证的正则字符串
11. var sReg = els[i].check;
12. //取得表单的值,用通用取值函数
13. var sVal = GetValue(els[i]);
14. //字符串->正则表达式,不区分大小写
15. var reg = new RegExp(sReg,"i");
16. if(!reg.test(sVal))
17. {
18. //验证不通过,弹出提示warning
19. alert(els[i].warning);
20. //该表单元素取得焦点,用通用返回函数
21. GoBack(els[i])
22. return false;
23. }
24. }
25. }
26.}
27.
28.//通用取值函数分三类进行取值
29.//文本输入框,直接取值el.value
30.//单多选,遍历所有选项取得被选中的个数返回结果"00"表示选中两个
31.//单多下拉菜单,遍历所有选项取得被选中的个数返回结果"0"表示选中一个
32.function GetValue(el)
33.{
34. //取得表单元素的类型
35. var sType = el.type;
36. switch(sType)
37. {
38. case "text":
39. case "hidden":
40. case "password":
41. case "file":
42. case "textarea": return el.value;
43. case "checkbox":
44. case "radio": return GetValueChoose(el);
45. case "select-one":
46. case "select-multiple": return GetValueSel(el);
47. }
48. //取得radio,checkbox的选中数,用"0"来表示选中的个数,我们写正则的时候就可以通过0{1,}来表示选中个数
49. function GetValueChoose(el)
50. {
51. var sValue = "";
52. //取得第一个元素的name,搜索这个元素组
53. var tmpels = document.getElementsByName(el.name);
54. for(var i=0;i<tmpels.length;i++)
55. {
56. if(tmpels[i].checked)
57. {
58. sValue += "0";
59. }
60. }
61. return sValue;
62. }
63. //取得select的选中数,用"0"来表示选中的个数,我们写正则的时候就可以通过0{1,}来表示选中个数
64. function GetValueSel(el)
65. {
66. var sValue = "";
67. for(var i=0;i<el.options.length;i++)
68. {
69. //单选下拉框提示选项设置为value=""
70. if(el.options[i].selected && el.options[i].value!="")
71. {
72. sValue += "0";
73. }
74. }
75. return sValue;
76. }
77.}
78.
79.//通用返回函数,验证没通过返回的效果.分三类进行取值
80.//文本输入框,光标定位在文本输入框的末尾
81.//单多选,第一选项取得焦点
82.//单多下拉菜单,取得焦点
83.function GoBack(el)
84.{
85. //取得表单元素的类型
86. var sType = el.type;
87. switch(sType)
88. {
89. case "text":
90. case "hidden":
91. case "password":
92. case "file":
93. case "textarea": el.focus();var rng = el.createTextRange(); rng.collapse(false); rng.select();
94. case "checkbox":
95. case "radio": var els = document.getElementsByName(el.name);els[0].focus();
96. case "select-one":
97. case "select-multiple":el.focus();
98. }
99.}
function CheckForm(oForm)
{
var els = oForm.elements;
//遍历所有表元素
for(var i=0;i<els.length;i++)
{
//是否需要验证
if(els[i].check)
{
//取得验证的正则字符串
var sReg = els[i].check;
//取得表单的值,用通用取值函数
var sVal = GetValue(els[i]);
//字符串->正则表达式,不区分大小写
var reg = new RegExp(sReg,"i");
if(!reg.test(sVal))
{
//验证不通过,弹出提示warning
alert(els[i].warning);
//该表单元素取得焦点,用通用返回函数
GoBack(els[i])
return false;
}
}
}
}

//通用取值函数分三类进行取值
//文本输入框,直接取值el.value
//单多选,遍历所有选项取得被选中的个数返回结果"00"表示选中两个
//单多下拉菜单,遍历所有选项取得被选中的个数返回结果"0"表示选中一个
function GetValue(el)
{
//取得表单元素的类型
var sType = el.type;
switch(sType)
{
case "text":
case "hidden":
case "password":
case "file":
case "textarea": return el.value;
case "checkbox":
case "radio": return GetValueChoose(el);
case "select-one":
case "select-multiple": return GetValueSel(el);
}
//取得radio,checkbox的选中数,用"0"来表示选中的个数,我们写正则的时候就可以通过0{1,}来表示选中个数
function GetValueChoose(el)
{
var sValue = "";
//取得第一个元素的name,搜索这个元素组
var tmpels = document.getElementsByName(el.name);
for(var i=0;i<tmpels.length;i++)
{
if(tmpels[i].checked)
{
sValue += "0";
}
}
return sValue;
}
//取得select的选中数,用"0"来表示选中的个数,我们写正则的时候就可以通过0{1,}来表示选中个数
function GetValueSel(el)
{
var sValue = "";
for(var i=0;i<el.options.length;i++)
{
//单选下拉框提示选项设置为value=""
if(el.options[i].selected && el.options[i].value!="")
{
sValue += "0";
}
}
return sValue;
}
}

//通用返回函数,验证没通过返回的效果.分三类进行取值
//文本输入框,光标定位在文本输入框的末尾
//单多选,第一选项取得焦点
//单多下拉菜单,取得焦点
function GoBack(el)
{
//取得表单元素的类型
var sType = el.type;
switch(sType)
{
case "text":
case "hidden":
case "password":
case "file":
case "textarea": el.focus();var rng = el.createTextRange(); rng.collapse(false); rng.select();
case "checkbox":
case "radio": var els = document.getElementsByName(el.name);els[0].focus();
case "select-one":
case "select-multiple":el.focus();
}
}



使用方法:

账号:<input type="text" check="^\S+$" warning="账号不能为空,且不能含有空格" name="id">不能为空<br>











常用正则:

Js代码
1.匹配中文字符的正则表达式： [\u4e00-\u9fa5]
2.评注：匹配中文还真是个头疼的事，有了这个表达式就好办了
3.
4.匹配双字节字符(包括汉字在内)：[^\x00-\xff]
5.评注：可以用来计算字符串的长度（一个双字节字符长度计2，ASCII字符计1）
6.
7.匹配空白行的正则表达式：\n\s*\r
8.评注：可以用来删除空白行
9.
10.匹配HTML标记的正则表达式：<(\S*?)[^>]*>.*?</\1>|<.*? />
11.评注：网上流传的版本太糟糕，上面这个也仅仅能匹配部分，对于复杂的嵌套标记依旧无能为力
12.
13.匹配首尾空白字符的正则表达式：^\s*|\s*$
14.评注：可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等)，非常有用的表达式
15.
16.匹配Email地址的正则表达式：\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*
17.评注：表单验证时很实用
18.
19.匹配网址URL的正则表达式：[a-zA-z]+://[^\s]*
20.评注：网上流传的版本功能很有限，上面这个基本可以满足需求
21.
22.匹配帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：^[a-zA-Z][a-zA-Z0-9_]{4,15}$
23.评注：表单验证时很实用
24.
25.匹配国内电话号码：\d{3}-\d{8}|\d{4}-\d{7}
26.评注：匹配形式如 0511-4405222 或 021-87888822
27.
28.匹配腾讯QQ号：[1-9][0-9]{4,}
29.评注：腾讯QQ号从10000开始
30.
31.匹配中国邮政编码：[1-9]\d{5}(?!\d)
32.评注：中国邮政编码为6位数字
33.
34.匹配身份证：\d{15}|\d{18}
35.评注：中国的身份证为15位或18位
36.
37.匹配ip地址：\d+\.\d+\.\d+\.\d+
38.评注：提取ip地址时有用
39.
40.匹配特定数字：
41.^[1-9]\d*$　 　 //匹配正整数
42.^-[1-9]\d*$ 　 //匹配负整数
43.^-?[1-9]\d*$　　 //匹配整数
44.^[1-9]\d*|0$　 //匹配非负整数（正整数 + 0）
45.^-[1-9]\d*|0$　　 //匹配非正整数（负整数 + 0）
46.^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$　　 //匹配正浮点数
47.^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$　 //匹配负浮点数
48.^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$　 //匹配浮点数
49.^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$　　 //匹配非负浮点数（正浮点数 + 0）
50.^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$　　//匹配非正浮点数（负浮点数 + 0）
51.评注：处理大量数据时有用，具体应用时注意修正
52.
53.匹配特定字符串：
54.^[A-Za-z]+$　　//匹配由26个英文字母组成的字符串
55.^[A-Z]+$　　//匹配由26个英文字母的大写组成的字符串
56.^[a-z]+$　　//匹配由26个英文字母的小写组成的字符串
57.^[A-Za-z0-9]+$　　//匹配由数字和26个英文字母组成的字符串
58.^\w+$　　//匹配由数字、26个英文字母或者下划线组成的字符串
59.评注：最基本也是最常用的一些表达式
60.
61.原载地址：http://lifesinger.3322.org/myblog/?p=185
62.
63.
64.收集一些常用的正则表达式。
65.
66.
67.
68.正则表达式用于字符串处理，表单验证等场合，实用高效，但用到时总是不太把握，以致往往要上网查一
69.
70.番。我将一些常用的表达式收藏在这里，作备忘之用。本贴随时会更新。
71.
72.匹配中文字符的正则表达式： [u4e00-u9fa5]
73.
74.匹配双字节字符(包括汉字在内)：[^x00-xff]
75.
76.应用：计算字符串的长度（一个双字节字符长度计2，ASCII字符计1）
77.
78.String.prototype.len=function(){return this.replace([^x00-xff]/g,"aa").length;}
79.
80.匹配空行的正则表达式：n[s| ]*r
81.
82.匹配HTML标记的正则表达式：/<(.*)>.*</1>|<(.*) />/
83.
84.匹配首尾空格的正则表达式：(^s*)|(s*$)
85.
86.应用：javascript中没有像vbscript那样的trim函数，我们就可以利用这个表达式来实现，如下：
87.
88.String.prototype.trim = function()
89.{
90.return this.replace(/(^s*)|(s*$)/g, "");
91.}
92.
93.利用正则表达式分解和转换IP地址：
94.
95.下面是利用正则表达式匹配IP地址，并将IP地址转换成对应数值的Javascript程序：
96.
97.function IP2V(ip)
98.{
99.re=/(d+).(d+).(d+).(d+)/g //匹配IP地址的正则表达式
100.if(re.test(ip))
101.{
102.return RegExp.$1*Math.pow(255,3))+RegExp.$2*Math.pow(255,2))+RegExp.$3*255+RegExp.$4*1
103.}
104.else
105.{
106.throw new Error("Not a valid IP address!")
107.}
108.}
109.
110.不过上面的程序如果不用正则表达式，而直接用split函数来分解可能更简单，程序如下：
111.
112.var ip="10.100.20.168"
113.ip=ip.split(".")
114.alert("IP值是："+(ip[0]*255*255*255+ip[1]*255*255+ip[2]*255+ip[3]*1))
115.
116.匹配Email地址的正则表达式：w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*
117.
118.匹配网址URL的正则表达式：http://([w-]+.)+[w-]+(/[w- ./?%&=]*)?
119.
120.利用正则表达式去除字串中重复的字符的算法程序：
121.
122.var s="abacabefgeeii"
123.var s1=s.replace(/(.).*1/g,"$1")
124.var re=new RegExp("["+s1+"]","g")
125.var s2=s.replace(re,"")
126.alert(s1+s2) //结果为：abcefgi
127.
128.我原来在CSDN上发贴寻求一个表达式来实现去除重复字符的方法，最终没有找到，这是我能想到的最简单
129.
130.的实现方法。思路是使用后向引用取出包括重复的字符，再以重复的字符建立第二个表达式，取到不重复
131.
132.的字符，两者串连。这个方法对于字符顺序有要求的字符串可能不适用。
133.
134.得用正则表达式从URL地址中提取文件名的javascript程序，如下结果为page1
135.
136.s="http://www.9499.net/page1.htm"
137.s=s.replace(/(.*/){0,}([^.]+).*/ig,"$2")
138.alert(s)
139.
140.利用正则表达式限制网页表单里的文本框输入内容：
141.
142.用 正则表达式限制只能输入中文：οnkeyup="value=value.replace(/[^u4E00-u9FA5]/g,'''')"
143.
144.onbeforepaste="clipboardData.setData(''text'',clipboardData.getData(''text'').replace(/
145.
146.[^u4E00-u9FA5]/g,''''))"
147.
148.用 正则表达式限制只能输入全角字符： οnkeyup="value=value.replace(/[^uFF00-uFFFF]/g,'''')"
149.
150.onbeforepaste="clipboardData.setData(''text'',clipboardData.getData(''text'').replace(/
151.
152.[^uFF00-uFFFF]/g,''''))"
153.
154.用 正则表达式限制只能输入数字：οnkeyup="value=value.replace(/[^d]/g,'''')
155.
156."onbeforepaste="clipboardData.setData(''text'',clipboardData.getData(''text'').replace(/
157.
158.[^d]/g,''''))"
159.
160.用 正则表达式限制只能输入数字和英文：οnkeyup="value=value.replace(/[W]/g,'''')
161.
162."onbeforepaste="clipboardData.setData(''text'',clipboardData.getData(''text'').replace(/[^d]
163.
164.常用的正则表达式
165.
166.1、非负整数：”^d+$”
167.
168.2、正整数：”^[0-9]*[1-9][0-9]*$”
169.
170.3、非正整数：”^((-d+)|(0+))$”
171.
172.4、负整数：”^-[0-9]*[1-9][0-9]*$”
173.
174.5、整数：”^-?d+$”
175.
176.6、非负浮点数：”^d+(.d+)?$”
177.
178.7、正浮点数：”^((0-9)+.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*.[0-9]+)|([0-9]*[1-9][0-9]*))$
179.
180.”
181.
182.8、非正浮点数：”^((-d+.d+)?)|(0+(.0+)?))$”
183.
184.9、负浮点数：”^(-((正浮点数正则式)))$”
185.
186.10、英文字符串：”^[A-Za-z]+$”
187.
188.11、英文大写串：”^[A-Z]+$”
189.
190.12、英文小写串：”^[a-z]+$”
191.
192.13、英文字符数字串：”^[A-Za-z0-9]+$”
193.
194.14、英数字加下划线串：”^w+$”
195.
196.15、E-mail地址：”^[w-]+(.[w-]+)*@[w-]+(.[w-]+)+$”
197.
198.16、URL：”^[a-zA-Z]+://(w+(-w+)*)(.(w+(-w+)*))*(?s*)?$”
199.
200."^\d+$"　　//非负整数（正整数 + 0）
201."^\[0-9\]*\[1-9\]\[0-9\]*$"　　//正整数
202."^((-\d+)\|(0+))$"　　//非正整数（负整数 + 0）
203."^-\[0-9\]*\[1-9\]\[0-9\]*$"　　//负整数
204."^-?\d+$"　　　　//整数
205."^\d+(\.\d+)?$"　　//非负浮点数（正浮点数 + 0）
206."^((\[0-9\]+\.\[0-9\]*\[1-9\]\[0-9\]*)\|(\[0-9\]*\[1-9\]\[0-9\]*\.\[0-9\]+)\|(\[0-9\]*\[1-9
207.
208.\]\[0-9\]*))$"　　//正浮点数
209."^((-\d+(\.\d+)?)\|(0+(\.0+)?))$"　　//非正浮点数（负浮点数 + 0）
210."^(-((\[0-9\]+\.\[0-9\]*\[1-9\]\[0-9\]*)\|(\[0-9\]*\[1-9\]\[0-9\]*\.\[0-9\]+)\|(\[0-9\]*\[1
211.
212.-9\]\[0-9\]*)))$"　　//负浮点数
213."^(-?\d+)(\.\d+)?$"　　//浮点数
214."^\[A-Za-z\]+$"　　//由26个英文字母组成的字符串
215."^\[A-Z\]+$"　　//由26个英文字母的大写组成的字符串
216."^\[a-z\]+$"　　//由26个英文字母的小写组成的字符串
217."^\[A-Za-z0-9\]+$"　　//由数字和26个英文字母组成的字符串
218."^\w+$"　　//由数字、26个英文字母或者下划线组成的字符串
219."^\[\w-\]+(\.\[\w-\]+)*@\[\w-\]+(\.\[\w-\]+)+$"　　　　//email地址
220."^\[a-zA-z\]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$"　　//url
221./^(d{2}\|d{4})-((0(\[1-9\]{1}))\|(1\[1\|2\]))-((\[0-2\](\[1-9\]{1}))\|(3\[0\|1\]))
222.
223.$/ // 年-月-日
224./^((0(\[1-9\]{1}))\|(1\[1\|2\]))/((\[0-2\](\[1-9\]{1}))\|(3\[0\|1\]))/(d{2}\|d{4})
225.
226.$/ // 月/日/年
227."^(\[w-.\]+)@((\[\[0-9\]{1,3}.\[0-9\]{1,3}.\[0-9\]{1,3}.)\|((\[w-\]+.)+))(\[a-zA-Z\]{2,4}
228.
229.\|\[0-9\]{1,3})(\]?)$" //Emil
230."(d+-)?(d{4}-?d{7}\|d{3}-?d{8}\|^d{7,8})(-d+)?" //电话号码
231."^(d{1,2}\|1dd\|2\[0-4\]d\|25\[0-5\]).(d{1,2}\|1dd\|2\[0-4\]d\|25\[0-5\]).(d{1,2}\|1dd\|2
232.
233.\[0-4\]d\|25\[0-5\]).(d{1,2}\|1dd\|2\[0-4\]d\|25\[0-5\])$" //IP地址
234.
235.匹配中文字符的正则表达式： \[\u4e00-\u9fa5\]
236.匹配双字节字符(包括汉字在内)：\[^\x00-\xff\]
237.匹配空行的正则表达式：\n\[\s\| \]*\r
238.匹配HTML标记的正则表达式：/<(.*)>.*<\/\1>\|<(.*) \/>/
239.匹配首尾空格的正则表达式：(^\s*)\|(\s*$)
240.匹配Email地址的正则表达式：\w+(\[-+.\]\w+)*@\w+(\[-.\]\w+)*\.\w+(\[-.\]\w+)\*
241.匹配网址URL的正则表达式：^\[a-zA-z\]+://(\\w+(-\\w+)*)(\\.(\\w+(-\\w+)*))*(\\?\\S*)?$
242.匹配帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：^\[a-zA-Z\]\[a-zA-Z0-9_\]
243.
244.{4,15}$
245.匹配国内电话号码：(\d{3}-\|\d{4}-)?(\d{8}\|\d{7})?
246.匹配腾讯QQ号：^\[1-9\]*\[1-9\]\[0-9\]*$