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

Javascript
jQuery开发者都需要知道的5个小技巧
Extjs学习笔记之六 面版
Javascript 中的类和闭包
IE6下JS动态设置图片src地址问题
Extjs学习笔记之七 布局
Extjs学习笔记之八 继承和事件基础
Extjs TriggerField在弹出窗口显示不出问题的解决方法
JavaScript中的集合及效率
利用js获取服务器时间的两个简单方法
在html页面上拖放移动标签
了解jQuery技巧来提高你的代码
JavaScript 页面坐标相关知识整理
Javascript UrlDecode函数代码
JQuery 遮罩层实现(mask)实现代码
jQuery 页面 Mask实现代码
Javascript的构造函数和constructor属性
js或css文件后面跟参数的原因说明
将CKfinder整合进CKEditor3.0的新方法
jQuery UI-Draggable 参数集合
jQuery 行级解析读取XML文件（附源码）

No. « 259 260 261 262 »

技术文章搜索

关键字

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

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-10-12   浏览: 251 ::
收藏到网摘: 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>