Heim > Web-Frontend > js-Tutorial > js 使用方法与函数 总结_javascript技巧

js 使用方法与函数 总结_javascript技巧

PHP中文网
Freigeben: 2016-05-16 18:53:00
Original
1227 Leute haben es durchsucht

js使用方法小结,比较不错,无论是新手,还是老手都是不错的。

1 创建脚本块
1:
2 隐藏脚本代码
1:
在不支持JavaScript的浏览器中将不执行相关代码
3 浏览器不支持的时候显示
1:
4 链接外部脚本文件
1:
5 注释脚本
1: // This is a comment
2: document.write(“Hello"); // This is a comment
3: /*
4: All of this
5: is a comment
6: */
6 输出到浏览器
1: document.write(“Hello");
7 定义变量
1: var myVariable = “some value";
8 字符串相加
1: var myString = “String1" + “String2";
9 字符串搜索
1:
10 字符串替换
1: thisVar.replace(“Monday","Friday");
11 格式化字串
1:
12 创建数组
1:
13 数组排序
1:
14 分割字符串
1:
15 弹出警告信息
1:
16 弹出确认框
1:
17 定义函数
1:
18 调用JS函数
1: Link text
2: Link text
19 在页面加载完成后执行函数
1:
2: Body of the page
3:
20 条件判断
1: <script> <br>2: <!-- <br/>3: var userChoice = window.confirm(“Choose OK or Cancel"); <br/>4: var result = (userChoice == true) ? “OK" : “Cancel"; <br/>5: document.write(result); <br/>6: // --> <br>7: </script>
21 指定次数循环
1: <script> <br>2: <!-- <br>3: var myArray = new Array(3); <br>4: myArray[0] = “Item 0"; <br>5: myArray[1] = “Item 1"; <br>6: myArray[2] = “Item 2"; <br>7: for (i = 0; i < myArray.length; i++) { <br>8: document.write(myArray[i] + “<br>"); <br>9: } <br>10: // --> <br>11: </script>
22 设定将来执行
1: <script> <br>2: <!-- <br/>3: function hello() { <br/>4: window.alert(“Hello"); <br/>5: } <br/>6: window.setTimeout(“hello()",5000); <br/>7: // --> <br>8: </script>
23 定时执行函数
1: <script> <br>2: <!-- <br/>3: function hello() { <br/>4: window.alert(“Hello"); <br/>5: window.setTimeout(“hello()",5000); <br/>6: } <br/>7: window.setTimeout(“hello()",5000); <br/>8: // --> <br>9: </script>
24 取消定时执行
1: <script> <br>2: <!-- <br/>3: function hello() { <br/>4: window.alert(“Hello"); <br/>5: } <br/>6: var myTimeout = window.setTimeout(“hello()",5000); <br/>7: window.clearTimeout(myTimeout); <br/>8: // --> <br>9: </script>
25 在页面卸载时候执行函数
1:
2: Body of the page
3:

26 访问document对象
1:
27 动态输出HTML
1:
28 输出换行
1: document.writeln(“a");
2: document.writeln(“b");
29 输出日期
1:
30 指定日期的时区
1:
31 设置日期输出格式
1:
32 读取URL参数
1:
你还以为HTML是无状态的么?
33 打开一个新的document对象
1:
34 页面跳转
1:
35 添加网页加载进度窗口
1:
2:
3:
6: The Main Page
7:


8:
9:

This is the main page


10:
11:

36 读取图像属性
1:
2: Width
3:
37 动态加载图像
1:
38 简单的图像替换
1:
7: 8: onMouseOut="document.myImage.src = defaultImage.src;">
9:
39 随机显示图像
1:
40 函数实现的图像替换
1:
14:
15: onMouseOut="document.myImage1.src = rollImage1[source].src;">
16:
17:

41 创建幻灯片
1:
19:

20:
21:
42 随机广告图片
1:

43 表单构成
1:

2:
3:
7:

8:
9:

44 访问表单中的文本框内容
1:

2:
3:

4: Check Text Field
45 动态复制文本框内容
1:

2: Enter some Text:

3: Copy Text:
4:

5: Copy Text Field
46 侦测文本框的变化
1:

2: Enter some Text:
3:

47 访问选中的Select
1:

2:
7:

8: Check Selection List
48 动态增加Select项
1:

2:
6:

7:
49 验证表单字段
1:
9:

10: Text Field:
11:

12:

50 验证Select项
1: function checkList(selection) {
2: if (selection.length == 0) {
3: window.alert(“You must make a selection from the list.");
4: return false;
5: }
6: return true;
7: }
51 动态改变表单的action
1:

2: Username:

3: Password:

4:
5:
6:
7:

52 使用图像按钮
1:

2: Username:

3: Password:

4:
5:

6:
53 表单数据的加密
1:
18:

19: Enter Some Text:
20:

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage