当前位置: 首页 > 图文教程 > 网络编程 > Javascript > js 使用方法与函数 总结

Javascript
javascript IFrame 强制刷新代码
JQuery 学习笔记 选择器之一
JQuery 学习笔记 选择器之二
JQuery 学习笔记 选择器之三
JQuery 学习笔记 element属性控制
Prototype 工具函数 学习
Prototype Selector对象学习
用JQuery 实现AJAX加载XML并解析的脚本
jquery 表单下所有元素的隐藏
javascript 动态table添加colspan\rowspan 参数的方法
利用javascript/jquery对上传文件格式过滤的方法
javaScript 判断字符串是否为数字的简单方法
jquery 将disabled的元素置为enabled的三种方法
javascript 解析后的xml对象的读取方法细解
IE中radio 或checkbox的checked属性初始状态下不能选中显示问题
javascript 一个函数对同一元素的多个事件响应
对象特征检测法判断浏览器对javascript对象的支持
javaScript Array（数组）相关方法简述
js 字符串操作函数
JavaScript中null与undefined分析

No. « 148 149 150 151 »

技术文章搜索

关键字

Javascript 中的 js 使用方法与函数 总结

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-10-12   浏览: 301 ::
收藏到网摘: n/a

js使用方法小结，比较不错，无论是新手，还是老手都是不错的。 1 创建脚本块
1: <script language="JavaScript">
2: JavaScript code goes here
3: </script>
2 隐藏脚本代码
1: <script language="JavaScript">
2: <!--
3: document.write(“Hello");
4: // -->
5: </script>
在不支持JavaScript的浏览器中将不执行相关代码
3 浏览器不支持的时候显示
1: <noscript>
2: Hello to the non-JavaScript browser.
3: </noscript>
4 链接外部脚本文件
1: <script language="JavaScript" src="/"filename.js""></script>
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(“<strong>Hello</strong>");
7 定义变量
1: var myVariable = “some value";
8 字符串相加
1: var myString = “String1" + “String2";
9 字符串搜索
1: <script language="JavaScript">
2: <!--
3: var myVariable = “Hello there";
4: var therePlace = myVariable.search(“there");
5: document.write(therePlace);
6: // -->
7: </script>
10 字符串替换
1: thisVar.replace(“Monday","Friday");
11 格式化字串
1: <script language="JavaScript">
2: <!--
3: var myVariable = “Hello there";
4: document.write(myVariable.big() + “<br>");
5: document.write(myVariable.blink() + “<br>");
6: document.write(myVariable.bold() + “<br>");
7: document.write(myVariable.fixed() + “<br>");
8: document.write(myVariable.fontcolor(“red") + “<br>");
9: document.write(myVariable.fontsize(“18pt") + “<br>");
10: document.write(myVariable.italics() + “<br>");
11: document.write(myVariable.small() + “<br>");
12: document.write(myVariable.strike() + “<br>");
13: document.write(myVariable.sub() + “<br>");
14: document.write(myVariable.sup() + “<br>");
15: document.write(myVariable.toLowerCase() + “<br>");
16: document.write(myVariable.toUpperCase() + “<br>");
17:
18: var firstString = “My String";
19: var finalString = firstString.bold().toLowerCase().fontcolor(“red");
20: // -->
21: </script>
12 创建数组
1: <script language="JavaScript">
2: <!--
3: var myArray = new Array(5);
4: myArray[0] = “First Entry";
5: myArray[1] = “Second Entry";
6: myArray[2] = “Third Entry";
7: myArray[3] = “Fourth Entry";
8: myArray[4] = “Fifth Entry";
9: var anotherArray = new Array(“First Entry","Second Entry","Third Entry","Fourth Entry","Fifth Entry");
10: // -->
11: </script>
13 数组排序
1: <script language="JavaScript">
2: <!--
3: var myArray = new Array(5);
4: myArray[0] = “z";
5: myArray[1] = “c";
6: myArray[2] = “d";
7: myArray[3] = “a";
8: myArray[4] = “q";
9: document.write(myArray.sort());
10: // -->
11: </script>
14 分割字符串
1: <script language="JavaScript">
2: <!--
3: var myVariable = “a,b,c,d";
4: var stringArray = myVariable.split(“,");
5: document.write(stringArray[0]);
6: document.write(stringArray[1]);
7: document.write(stringArray[2]);
8: document.write(stringArray[3]);
9: // -->
10: </script>
15 弹出警告信息
1: <script language="JavaScript">
2: <!--
3: window.alert(“Hello");
4: // -->
5: </script>
16 弹出确认框
1: <script language="JavaScript">
2: <!--
3: var result = window.confirm(“Click OK to continue");
4: // -->
5: </script>
17 定义函数
1: <script language="JavaScript">
2: <!--
3: function multiple(number1,number2) {
4: var result = number1 * number2;
5: return result;
6: }
7: // -->
8: </script>
18 调用JS函数
1: <a href="#" onClick="functionName()">Link text</a>
2: <a href="/"javascript:functionName"()">Link text</a>
19 在页面加载完成后执行函数
1: <body onLoad="functionName();">
2: Body of the page
3: </body>
20 条件判断
1: <script>
2: <!--
3: var userChoice = window.confirm(“Choose OK or Cancel");
4: var result = (userChoice == true) ? “OK" : “Cancel";
5: document.write(result);
6: // -->
7: </script>
21 指定次数循环
1: <script>
2: <!--
3: var myArray = new Array(3);
4: myArray[0] = “Item 0";
5: myArray[1] = “Item 1";
6: myArray[2] = “Item 2";
7: for (i = 0; i < myArray.length; i++) {
8: document.write(myArray[i] + “<br>");
9: }
10: // -->
11: </script>
22 设定将来执行
1: <script>
2: <!--
3: function hello() {
4: window.alert(“Hello");
5: }
6: window.setTimeout(“hello()",5000);
7: // -->
8: </script>
23 定时执行函数
1: <script>
2: <!--
3: function hello() {
4: window.alert(“Hello");
5: window.setTimeout(“hello()",5000);
6: }
7: window.setTimeout(“hello()",5000);
8: // -->
9: </script>
24 取消定时执行
1: <script>
2: <!--
3: function hello() {
4: window.alert(“Hello");
5: }
6: var myTimeout = window.setTimeout(“hello()",5000);
7: window.clearTimeout(myTimeout);
8: // -->
9: </script>
25 在页面卸载时候执行函数
1: <body onUnload="functionName();">
2: Body of the page
3: </body>
js使用方法小结，比较不错，无论是新手，还是老手都是不错的。
26 访问document对象
1: <script language="JavaScript">
2: var myURL = document.URL;
3: window.alert(myURL);
4: </script>
27 动态输出HTML
1: <script language="JavaScript">
2: document.write(“<p>Here's some information about this document:</p>");
3: document.write(“<ul>");
4: document.write(“<li>Referring Document: “ + document.referrer + “</li>");
5: document.write(“<li>Domain: “ + document.domain + “</li>");
6: document.write(“<li>URL: “ + document.URL + “</li>");
7: document.write(“</ul>");
8: </script>
28 输出换行
1: document.writeln(“<strong>a</strong>");
2: document.writeln(“b");
29 输出日期
1: <script language="JavaScript">
2: var thisDate = new Date();
3: document.write(thisDate.toString());
4: </script>
30 指定日期的时区
1: <script language="JavaScript">
2: var myOffset = -2;
3: var currentDate = new Date();
4: var userOffset = currentDate.getTimezoneOffset()/60;
5: var timeZoneDifference = userOffset - myOffset;
6: currentDate.setHours(currentDate.getHours() + timeZoneDifference);
7: document.write(“The time and date in Central Europe is: “ + currentDate.toLocaleString());
8: </script>
31 设置日期输出格式
1: <script language="JavaScript">
2: var thisDate = new Date();
3: var thisTimeString = thisDate.getHours() + “:" + thisDate.getMinutes();
4: var thisDateString = thisDate.getFullYear() + “/" + thisDate.getMonth() + “/" + thisDate.getDate();
5: document.write(thisTimeString + “ on “ + thisDateString);
6: </script>
32 读取URL参数
1: <script language="JavaScript">
2: var urlParts = document.URL.split(“?");
3: var parameterParts = urlParts[1].split(“&");
4: for (i = 0; i < parameterParts.length; i++) {
5: var pairParts = parameterParts[i].split(“=");
6: var pairName = pairParts[0];
7: var pairValue = pairParts[1];
8: document.write(pairName + “ ：“ +pairValue );
9: }
10: </script>
你还以为HTML是无状态的么？
33 打开一个新的document对象
1: <script language="JavaScript">
2: function newDocument() {
3: document.open();
4: document.write(“<p>This is a New Document.</p>");
5: document.close();
6: }
7: </script>
34 页面跳转
1: <script language="JavaScript">
2: window.location = “http://www.ruanchen.com/";
3: </script>
35 添加网页加载进度窗口
1: <html>
2: <head>
3: <script language='javaScript'>
4: var placeHolder = window.open('holder.html','placeholder','width=200,height=200');
5: </script>
6: <title>The Main Page</title>
7: </head>
8: <body onLoad='placeHolder.close()'>
9: <p>This is the main page</p>
10: </body>
11: </html>
js使用方法小结，比较不错，无论是新手，还是老手都是不错的。
36 读取图像属性
1: <img src="/"image1.jpg"" name="myImage">
2: <a href="# " onClick="window.alert(document.myImage.width)">Width</a>
3:
37 动态加载图像
1: <script language="JavaScript">
2: myImage = new Image;
3: myImage.src = “Tellers1.jpg";
4: </script>
38 简单的图像替换
1: <script language="JavaScript">
2: rollImage = new Image;
3: rollImage.src = “rollImage1.jpg";
4: defaultImage = new Image;
5: defaultImage.src = “image1.jpg";
6: </script>
7: <a href="/"myUrl"" onMouseOver="document.myImage.src = rollImage.src;"
8: onMouseOut="document.myImage.src = defaultImage.src;">
9: <img src="/"image1.jpg"" name="myImage" width=100 height=100 border=0>
39 随机显示图像
1: <script language="JavaScript">
2: var imageList = new Array;
3: imageList[0] = “image1.jpg";
4: imageList[1] = “image2.jpg";
5: imageList[2] = “image3.jpg";
6: imageList[3] = “image4.jpg";
7: var imageChoice = Math.floor(Math.random() * imageList.length);
8: document.write(‘<img src="' + imageList[imageChoice] + ‘“>');
9: </script>
40 函数实现的图像替换
1: <script language="JavaScript">
2: var source = 0;
3: var replacement = 1;
4: function createRollOver(originalImage,replacementImage) {
5: var imageArray = new Array;
6: imageArray[source] = new Image;
7: imageArray[source].src = originalImage;
8: imageArray[replacement] = new Image;
9: imageArray[replacement].src = replacementImage;
10: return imageArray;
11: }
12: var rollImage1 = createRollOver(“image1.jpg","rollImage1.jpg");
13: </script>
14: <a href="#" onMouseOver="document.myImage1.src = rollImage1[replacement].src;"
15: onMouseOut="document.myImage1.src = rollImage1[source].src;">
16: <img src="/"image1.jpg"" width=100 name="myImage1" border=0>
17: </a>
41 创建幻灯片
1: <script language="JavaScript">
2: var imageList = new Array;
3: imageList[0] = new Image;
4: imageList[0].src = “image1.jpg";
5: imageList[1] = new Image;
6: imageList[1].src = “image2.jpg";
7: imageList[2] = new Image;
8: imageList[2].src = “image3.jpg";
9: imageList[3] = new Image;
10: imageList[3].src = “image4.jpg";
11: function slideShow(imageNumber) {
12: document.slideShow.src = imageList[imageNumber].src;
13: imageNumber += 1;
14: if (imageNumber < imageList.length) {
15: window.setTimeout(“slideShow(“ + imageNumber + “)",3000);
16: }
17: }
18: </script>
19: </head>
20: <body onLoad="slideShow(0)">
21: <img src="/"image1.jpg"" width=100 name="slideShow">
42 随机广告图片
1: <script language="JavaScript">
2: var imageList = new Array;
3: imageList[0] = “image1.jpg";
4: imageList[1] = “image2.jpg";
5: imageList[2] = “image3.jpg";
6: imageList[3] = “image4.jpg";
7: var urlList = new Array;
8: urlList[0] = “http://www.jb51.com.cn/";
9: urlList[1] = “http://www.jb51.cn/";
10: urlList[2] = “http://www.kanshule.com/";
11: urlList[3] = “http://www.ruanchen.com/";
12: var imageChoice = Math.floor(Math.random() * imageList.length);
13: document.write(‘<a href="' + urlList[imageChoice] + ‘“><img src="' + imageList[imageChoice] + ‘“></a>');
14: </script>
js使用方法小结，比较不错，无论是新手，还是老手都是不错的。
43 表单构成
1: <form method="post" action="target.html" name="thisForm">
2: <input type="text" name="myText">
3: <select name="mySelect">
4: <option value="1">First Choice</option>
5: <option value="2">Second Choice</option>
6: </select>
7: <br>
8: <input type="submit" value="Submit Me">
9: </form>
44 访问表单中的文本框内容
1: <form name="myForm">
2: <input type="text" name="myText">
3: </form>
4: <a href='#' onClick='window.alert(document.myForm.myText.value);'>Check Text Field</a>
45 动态复制文本框内容
1: <form name="myForm">
2: Enter some Text: <input type="text" name="myText"><br>
3: Copy Text: <input type="text" name="copyText">
4: </form>
5: <a href="#" onClick="document.myForm.copyText.value =
6: document.myForm.myText.value;">Copy Text Field</a>
46 侦测文本框的变化
1: <form name="myForm">
2: Enter some Text: <input type="text" name="myText" onChange="alert(this.value);">
3: </form>
47 访问选中的Select
1: <form name="myForm">
2: <select name="mySelect">
3: <option value="First Choice">1</option>
4: <option value="Second Choice">2</option>
5: <option value="Third Choice">3</option>
6: </select>
7: </form>
8: <a href='#' onClick='alert(document.myForm.mySelect.value);'>Check Selection List</a>
48 动态增加Select项
1: <form name="myForm">
2: <select name="mySelect">
3: <option value="First Choice">1</option>
4: <option value="Second Choice">2</option>
5: </select>
6: </form>
7: <script language="JavaScript">
8: document.myForm.mySelect.length++;
9: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].text = “3";
10: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].value = “Third Choice";
11: </script>
49 验证表单字段
1: <script language="JavaScript">
2: function checkField(field) {
3: if (field.value == “") {
4: window.alert(“You must enter a value in the field");
5: field.focus();
6: }
7: }
8: </script>
9: <form name="myForm" action="target.html">
10: Text Field: <input type="text" name="myField"onBlur="checkField(this)">
11: <br><input type="submit">
12: </form>
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: <form name="myForm" action="login.html">
2: Username: <input type="text" name="username"><br>
3: Password: <input type="password" name="password"><br>
4: <input type="button" value="Login" onClick="this.form.submit();">
5: <input type="button" value="Register" onClick="this.form.action = ‘register.html'; this.form.submit();">
6: <input type="button" value="Retrieve Password" onClick="this.form.action = ‘password.html'; this.form.submit();">
7: </form>
52 使用图像按钮
1: <form name="myForm" action="login.html">
2: Username: <input type="text" name="username"><br>
3: Password: <input type="password"name="password"><br>
4: <input type="image" src="/"login.gif"" value="Login">
5: </form>
6:
53 表单数据的加密
1: <SCRIPT LANGUAGE='JavaScript'>
2: <!--
3: function encrypt(item) {
4: var newItem = '';
5: for (i=0; i < item.length; i++) {
6: newItem += item.charCodeAt(i) + '.';
7: }
8: return newItem;
9: }
10: function encryptForm(myForm) {
11: for (i=0; i < myForm.elements.length; i++) {
12: myForm.elements[i].value = encrypt(myForm.elements[i].value);
13: }
14: }
15:
16: //-->
17: </SCRIPT>
18: <form name='myForm' onSubmit='encryptForm(this); window.alert(this.myField.value);'>
19: Enter Some Text: <input type=text name=myField><input type=submit>
20: </form>