1: <script language=”JavaScript?gt;
2: JavaScript code goes here
3: </script>
2 隐藏脚本代码
1: <script language=”JavaScript?gt;
2: <!--
3: document.write(“Hello?;
4: // -->
5: </script>
在不支持JavaScript的浏览器中将不执行相关代?/p>
3 览器不支持的时候显C?/p>
1: <noscript>
2: Hello to the non-JavaScript browser.
3: </noscript>
4 链接外部脚本文g
1: <script language=”JavaScript?src="/”filename.js"?gt;</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(?lt;strong>Hello</strong>?;
7 定义变量
1: var myVariable = “some value?
8 字符串相?/p>
1: var myString = “String1?+ “String2?
9 字符串搜?/p>
1: <script language=”JavaScript?gt;
2: <!--
3: var myVariable = “Hello there?
4: var therePlace = myVariable.search(“there?;
5: document.write(therePlace);
6: // -->
7: </script>
10 字符串替?/p>
1: thisVar.replace(“Monday?”Friday?;
11 格式化字?/p>
1: <script language=”JavaScript?gt;
2: <!--
3: var myVariable = “Hello there?
4: document.write(myVariable.big() + ?lt;br>?;
5: document.write(myVariable.blink() + ?lt;br>?;
6: document.write(myVariable.bold() + ?lt;br>?;
7: document.write(myVariable.fixed() + ?lt;br>?;
8: document.write(myVariable.fontcolor(“red? + ?lt;br>?;
9: document.write(myVariable.fontsize(?8pt? + ?lt;br>?;
10: document.write(myVariable.italics() + ?lt;br>?;
11: document.write(myVariable.small() + ?lt;br>?;
12: document.write(myVariable.strike() + ?lt;br>?;
13: document.write(myVariable.sub() + ?lt;br>?;
14: document.write(myVariable.sup() + ?lt;br>?;
15: document.write(myVariable.toLowerCase() + ?lt;br>?;
16: document.write(myVariable.toUpperCase() + ?lt;br>?;
17:
18: var firstString = “My String?
19: var finalString = firstString.bold().toLowerCase().fontcolor(“red?;
20: // -->
21: </script>
12 创徏数组
1: <script language=”JavaScript?gt;
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?gt;
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 分割字符?/p>
1: <script language=”JavaScript?gt;
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?gt;
2: <!--
3: window.alert(“Hello?;
4: // -->
5: </script>
16 弹出认?/p>
1: <script language=”JavaScript?gt;
2: <!--
3: var result = window.confirm(“Click OK to continue?;
4: // -->
5: </script>
17 定义函数
1: <script language=”JavaScript?gt;
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()?gt;Link text</a>
2: <a href="/”javascript:functionName"()?gt;Link text</a>
19 在页面加载完成后执行函数
1: <body onLoad=”functionName();?gt;
2: Body of the page
3: </body>
20 条g判断
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] + ?lt;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 在页面卸载时候执行函?/p>
1: <body onUnload=”functionName();?gt;
2: Body of the page
3: </body>
JavaScriptp么回?Q浏览器输出
26 讉Kdocument对象
1: <script language=”JavaScript?gt;
2: var myURL = document.URL;
3: window.alert(myURL);
4: </script>
27 动态输出HTML
1: <script language=”JavaScript?gt;
2: document.write(?lt;p>Here’s some information about this document:</p>?;
3: document.write(?lt;ul>?;
4: document.write(?lt;li>Referring Document: ?+ document.referrer + ?lt;/li>?;
5: document.write(?lt;li>Domain: ?+ document.domain + ?lt;/li>?;
6: document.write(?lt;li>URL: ?+ document.URL + ?lt;/li>?;
7: document.write(?lt;/ul>?;
8: </script>
28 输出换行
1: document.writeln(?lt;strong>a</strong>?;
2: document.writeln(“b?;
29 输出日期
1: <script language=”JavaScript?gt;
2: var thisDate = new Date();
3: document.write(thisDate.toString());
4: </script>
30 指定日期的时?/p>
1: <script language=”JavaScript?gt;
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?gt;
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 dURL参数
1: <script language=”JavaScript?gt;
2: var urlParts = document.URL.split(??;
3: var parameterParts = urlParts[1].split(?amp;?;
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 + ?Q?+pairValue );
9: }
10: </script>
你还以ؓHTML是无状态的么？
33 打开一个新的document对象
1: <script language=”JavaScript?gt;
2: function newDocument() {
3: document.open();
4: document.write(?lt;p>This is a New Document.</p>?;
5: document.close();
6: }
7: </script>
34 面跌{
1: <script language=”JavaScript?gt;
2: window.location = “http://www.liu21st.com/?
3: </script>
35 d|页加蝲q度H口
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>
JavaScriptp么回?Q图?
36 d囑փ属?/p>
1: <img src="/”image1.jpg"?name=”myImage?gt;
2: <a href=? ?onClick=”window.alert(document.myImage.width)?gt;Width</a>
3:
37 动态加载图?/p>
1: <script language=”JavaScript?gt;
2: myImage = new Image;
3: myImage.src = “Tellers1.jpg?
4: </script>
38 单的囑փ替换
1: <script language=”JavaScript?gt;
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;?br />8: onMouseOut=”document.myImage.src = defaultImage.src;?gt;
9: <img src="/”image1.jpg"?name=”myImage?width=100 height=100 border=0>
39 随机昄囑փ
1: <script language=”JavaScript?gt;
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(?lt;img src=”?+ imageList[imageChoice] + ‘?gt;?;
9: </script>
40 函数实现的图像替?/p>
1: <script language=”JavaScript?gt;
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;?br />15: onMouseOut=”document.myImage1.src = rollImage1[source].src;?gt;
16: <img src="/”image1.jpg"?width=100 name=”myImage1?border=0>
17: </a>
41 创徏qȝ?/p>
1: <script language=”JavaScript?gt;
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)?gt;
21: <img src="/”image1.jpg"?width=100 name=”slideShow?gt;
42 随机q告囄
1: <script language=”JavaScript?gt;
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://some.host/?
9: urlList[1] = “http://another.host/?
10: urlList[2] = “http://somewhere.else/?
11: urlList[3] = “http://right.here/?
12: var imageChoice = Math.floor(Math.random() * imageList.length);
13: document.write(?lt;a href=”?+ urlList[imageChoice] + ‘?gt;<img src=”?+ imageList[imageChoice] + ‘?gt;</a>?;
14: </script>
JavaScriptp么回?Q表?
q是先l写完JSp么回事系列吧?br />43 表单构成
1: <form method=”post?action=”target.html?name=”thisForm?gt;
2: <input type=”text?name=”myText?gt;
3: <select name=”mySelect?gt;
4: <option value=??gt;First Choice</option>
5: <option value=??gt;Second Choice</option>
6: </select>
7: <br>
8: <input type=”submit?value=”Submit Me?gt;
9: </form>
44 讉K表单中的文本框内?/p>
1: <form name=”myForm?gt;
2: <input type=”text?name=”myText?gt;
3: </form>
4: <a href='#' onClick='window.alert(document.myForm.myText.value);'>Check Text Field</a>
45 动态复制文本框内容
1: <form name=”myForm?gt;
2: Enter some Text: <input type=”text?name=”myText?gt;<br>
3: Copy Text: <input type=”text?name=”copyText?gt;
4: </form>
5: <a href=??onClick=”document.myForm.copyText.value =
6: document.myForm.myText.value;?gt;Copy Text Field</a>
46 侦测文本框的变化
1: <form name=”myForm?gt;
2: Enter some Text: <input type=”text?name=”myText?onChange=”alert(this.value);?gt;
3: </form>
47 讉K选中的Select
1: <form name=”myForm?gt;
2: <select name=”mySelect?gt;
3: <option value=”First Choice?gt;1</option>
4: <option value=”Second Choice?gt;2</option>
5: <option value=”Third Choice?gt;3</option>
6: </select>
7: </form>
8: <a href='#' onClick='alert(document.myForm.mySelect.value);'>Check Selection List</a>
48 动态增加Select?/p>
1: <form name=”myForm?gt;
2: <select name=”mySelect?gt;
3: <option value=”First Choice?gt;1</option>
4: <option value=”Second Choice?gt;2</option>
5: </select>
6: </form>
7: <script language=”JavaScript?gt;
8: document.myForm.mySelect.length++;
9: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].text = ??
10: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].value = “Third Choice?
11: </script>
49 验证表单字段
1: <script language=”JavaScript?gt;
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?gt;
10: Text Field: <input type=”text?name=”myField”onBlur=”checkField(this)?gt;
11: <br><input type=”submit?gt;
12: </form>
50 验证Select?/p>
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?gt;
2: Username: <input type=”text?name=”username?gt;<br>
3: Password: <input type=”password?name=”password?gt;<br>
4: <input type=”button?value=”Login?onClick=”this.form.submit();?gt;
5: <input type=”button?value=”Register?onClick=”this.form.action = ‘register.html? this.form.submit();?gt;
6: <input type=”button?value=”Retrieve Password?onClick=”this.form.action = ‘password.html? this.form.submit();?gt;
7: </form>
52 使用囑փ按钮
1: <form name=”myForm?action=”login.html?gt;
2: Username: <input type=”text?name=”username?gt;<br>
3: Password: <input type=”password”name=”password?gt;<br>
4: <input type=”image?src="/”login.gif"?value=”Login?gt;
5: </form>
6:
53 表单数据的加?/p>
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>
JavaScriptp么回?Q窗口和框架
54 改变览器状态栏文字提示
1: <script language=”JavaScript?gt;
2: window.status = “A new status message?
3: </script>
55 弹出认提示?/p>
1: <script language=”JavaScript?gt;
2: var userChoice = window.confirm(“Click OK or Cancel?;
3: if (userChoice) {
4: document.write(“You chose OK?;
5: } else {
6: document.write(“You chose Cancel?;
7: }
8: </script>
56 提示输入
1: <script language=”JavaScript?gt;
2: var userName = window.prompt(“Please Enter Your Name?”Enter Your Name Here?;
3: document.write(“Your Name is ?+ userName);
4: </script>
57 打开一个新H口
1: //打开一个名UCؓmyNewWindow的浏览器新窗?br />2: <script language=”JavaScript?gt;
3: window.open(“http://www.liu21st.com/?”myNewWindow?;
4: </script>
58 讄新窗口的大小
1: <script language=”JavaScript?gt;
2: window.open(“http://www.liu21st.com/?”myNewWindow?'height=300,width=300');
3: </script>
59 讄新窗口的位置
1: <script language=”JavaScript?gt;
2: window.open(“http://www.liu21st.com/?”myNewWindow?'height=300,width=300,left=200,screenX=200,top=100,screenY=100');
3: </script>
60 是否昄工具栏和滚动?/p>
1: <script language=”JavaScript?gt;
2: window.open(“http:
61 是否可以~放新窗口的大小
1: <script language=”JavaScript?gt;
2: window.open('http://www.liu21st.com/' , 'myNewWindow', 'resizable=yes' );</script>
62 加蝲一个新的文到当前H口
1: <a href='#' onClick='document.location = '125a.html';' >Open New Document</a>
63 讄面的滚动位|?/p>
1: <script language=”JavaScript?gt;
2: if (document.all) { //如果是IE览器则使用scrollTop属?br />3: document.body.scrollTop = 200;
4: } else { //如果是NetScape览器则使用pageYOffset属?br />5: window.pageYOffset = 200;
6: }</script>
64 在IE中打开全屏H口
1: <a href='#' onClick=”window.open('http://www.juxta.com/','newWindow','fullScreen=yes');?gt;Open a full-screen window</a>
65 新窗口和父窗口的操作
1: <script language=”JavaScript?gt;
2: //定义新窗?br />3: var newWindow = window.open(?28a.html?”newWindow?;
4: newWindow.close(); //在父H口中关闭打开的新H口
5: </script>
6: 在新H口中关闭父H口
7: window.opener.close()
66 往新窗口中写内?/p>
1: <script language=”JavaScript?gt;
2: var newWindow = window.open(“?”newWindow?;
3: newWindow.document.open();
4: newWindow.document.write(“This is a new window?;
5: newWIndow.document.close();
6: </script>
67 加蝲面到框枉?/p>
1: <frameset cols=?0%,*?gt;
2: <frame name=”frame1?src="/?35a.html"?gt;
3: <frame name=”frame2?src="/”about:blank"?gt;
4: </frameset>
5: 在frame1中加载frame2中的面
6: parent.frame2.document.location = ?35b.html?
68 在框枉面之间共享脚?br />如果在frame1中html文g中有个脚?/p>
1: function doAlert() {
2: window.alert(“Frame 1 is loaded?;
3: }
那么在frame2中可以如此调用该Ҏ
1: <body onLoad=”parent.frame1.doAlert();?gt;
2: This is frame 2.
3: </body>
69 数据公用
可以在框枉面定义数据项Q得该数据可以被多个框架中的页面公?/p>
1: <script language=”JavaScript?gt;
2: var persistentVariable = “This is a persistent value?
3: </script>
4: <frameset cols=?0%,*?gt;
5: <frame name=”frame1?src="/?38a.html"?gt;
6: <frame name=”frame2?src="/?38b.html"?gt;
7: </frameset>
q样在frame1和frame2中都可以使用变量persistentVariable
70 框架代码?br />Ҏ以上的一些思\Q我们可以用一个隐藏的框架面来作为整个框枉的代码库
1: <frameset cols=?,50%,*?gt;
2: <frame name=”codeFrame?src="/?40code.html"?gt;
3: <frame name=”frame1?src="/?40a.html"?gt;
4: <frame name=”frame2?src="/?40b.html"?gt;
5: </frameset>
属?/strong>
描述
onreadystatechange
每次状态改变所触发事g的事件处理程?/p>
readyState
对象状态|
- 0 = 未初始化QuninitializedQ?
- 1 = 正在加蝲QloadingQ?
- 2 = 加蝲完毕QloadedQ?
- 3 = 交互QinteractiveQ?
- 4 = 完成QcompleteQ?
responseText
从服务器q程q回的数据的字符串Ş?/p>
responseXML
从服务器q程q回的DOM兼容的文数据对?/p>
status
从服务器q回的数字代码，比如404Q未扑ֈQ或200Q就l）
statusText
伴随状态码的字W串信息
A.例子一:如何获得面中的所有HTML元素?
<HTML>
<HEAD><TITLE>昄面中所有的HTML元素</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function showElements() {
var tag_names = "";
for (i=0; i<document.all.length; i++)
tag_names = tag_names + document.all(i).tagName + " ";
alert("本页面中的元素有 " + tag_names);
}
</SCRIPT>
</HEAD>
<BODY onload="showElements()">
<H1>Ƣ迎</H1>
<P>q是一?<B>试</B> 文g.</P>
</BODY>
</HTML>
B.例子?如何获得元素的子元素Q?
<HTML id=theHTML>
<HEAD>
<TITLE>昄所有元素及theHTML的子元素</TITLE>
<SCRIPT language=JavaScript>
function showme() {
alert('theHTML下共?' + window.theHTML.all.length+' 个HTML的元?);
for (i=0; i < theHTML.all.length;i++)
{
alert(theHTML.all[i].tagName);
}
alert('theHTML下的子元素共?' + window.theHTML.children.length+' ?)
;
for (i=0; i < theHTML.children.length;i++)
{
alert(theHTML.children[i].tagName);
}
}
</SCRIPT>
</HEAD>
<BODY onload=showme()>
<DIV></DIV>
</BODY>
</HTML>
C.例子?如何获得面内某个元素的内容和改变它的某些属?
<html>
<head>
<title>Untitled Document</title>
<script language="JavaScript">
function getTags(){
var get_tables = document.all.tags("TABLE");
for (i=0; i<get_tables.length; i++)
alert('W?+(i+1)+'个TABLE元素内的内容?\n'+get_tables(i).innerHTML
+'\n'+'当你按下定后这个TABLE的属性之一[BORDER]的值将变ؓ1');
get_tables(i-1).border = 1;
}
</script>
</head>
<body onLoad=getTags()>
<table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<a href=">
</tr>
</table>
</body>
</html>
D.例子?用另一U方法来改变元素的属性的?
<HTML>
<HEAD><TITLE>Ҏ?</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function showAndSetAlignment() {
alert(MyHeading.getAttribute("align"));
MyHeading.setAttribute("align","center");
}
</SCRIPT>
</HEAD>
<BODY onload="showAndSetAlignment()">
<H1 ID=MyHeading ALIGN="left">Ƣ迎光</H1>
<P>HTTP://WWW.FLASHABC.COM
</BODY>
</HTML>
E.例子?昄出页中的元素l构
<HTML>
<HEAD><TITLE>Elements: Hierarchy</TITLE>
<SCRIPT LANGUAGE="JScript">
function showHierarchy() {
var depth = 0;
var msg = document.all(0).tagName;
for (i=1; i<document.all.length; i++) {
if (document.all(i-1).contains(document.all(i))==true) {
depth = depth + 1;
} else {
var elParent = document.all(i-1).parentElement;
for ( ; depth>0; depth--) {
if (elParent.contains(document.all(i))==true)
break;
elParent = elParent.parentElement;
}
}
msg = msg + "\n";
for (j=1; j<=depth; j++)
msg = msg + " ";
msg = msg + document.all(i).tagName;
}
alert("q个面中包含的元素为\n" + msg);
}
</SCRIPT>
</HEAD>
<BODY onload="showHierarchy()">
<H1>Ƣ迎光</H1>
<P>你看到预想的<B>l果</B> 了吗.
</BODY>
</HTML>
q有几个例?你自q看就会明白是做什么用途啦
var coll = document.all.tags("H1");
if (coll.length>0)
coll(0).align="center";
var coll = document.all.tags("IMG");
if (coll.length>0)
coll(0).src="newimage.gif";
var coll = document.all.tags("H1");
for (i=0; i<coll.length; i++)
coll[i].style.color = "green";
下一?用showModalDialog来打开面 作?时の?
<head>
<title><bean:message key="hrUsers.maint" /></title>
<script language="javascript">
var textId;
var text;
function calendarDefalut(name) //定义dateSelector的displayҎQ它实C个日历Ş式的日期选择框?BR>{
var myDate=new Date();
this.year=myDate.getFullYear(); //定义year属性，q䆾Q默认gؓ当前pȝq䆾?BR> this.month=myDate.getMonth()+1; //定义month属性，月䆾Q默认gؓ当前pȝ月䆾?BR> calendar('default',name,this.year+'/'+this.month);
}
function calendar(id,name,value) //定义dateSelector的displayҎQ它实C个日历Ş式的日期选择框?BR>{
textId = id;
document.write("<style type=text/css>");
document.write(" .ds_font td,span { font: normal 12px 宋体; color: #000000; }");
document.write(" .ds_border { border: 1px solid #000000; cursor: hand; background-color: #F7F7F7 }");
document.write(" .ds_border2 { border: 1px solid #000000; cursor: hand; background-color: #F7F7F7 }");
document.write("</style>");
document.write(" <span width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=subYear() title='减小q䆾'><< </span>");
document.write(" <span width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=subMonth() title='减小月䆾'><</span>");
document.write(" <span width=52%><input id='"+id+"' type='text' name='"+name+"' value="+value+" readonly='readonly' size='3' style='border-style: solid; border-color: #FFFFFF;border: 0px solid #000000; background-color: #F7F7F7'></span>");
document.write(" <span width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=addMonth() title='增加月䆾'>> </span>");
document.write(" <span width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=addYear() title='增加q䆾'>>></span>");
text= document.getElementById(textId);
}
function subYear() //减小q䆾
{
var value = text.value;
text.value = (eval(value.substr(0,4))-1)+'/'+value.substr(5,2);
}
function addYear() //增加q䆾
{
var value = text.value;
text.value = (eval(value.substr(0,4))+1)+'/'+value.substr(5,2);
}
function subMonth() //减小月䆾
{
var value = text.value;
var month=eval(value.substr(5,2))-1;
var year = value.substr(0,4)
if(month==0)
{
month=12;
year = eval(year)-1;
}
text.value = year+'/'+month;
}
function addMonth() //增加月䆾
{
var value = text.value;
var month=eval(value.substr(5,2))+1;
var year = value.substr(0,4)
if(month==13)
{
month=1;
year = eval(year)+1;
}
text.value = eval(year)+'/'+month;
}
</script>
</HEAD>
ssss:<script language=javascript>calendarDefalut('hrUsers.userNo');</script>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
<script language=javascript>
var DS_x,DS_y;
function dateSelector() //构造dateSelector对象Q用来实C个日历Ş式的日期输入框?BR>{
var myDate=new Date();
this.year=myDate.getFullYear(); //定义year属性，q䆾Q默认gؓ当前pȝq䆾?BR> this.month=myDate.getMonth()+1; //定义month属性，月䆾Q默认gؓ当前pȝ月䆾?BR> this.date=myDate.getDate(); //定义date属性，日，默认gؓ当前pȝ的日?BR> this.inputName=''; //定义inputName属性，卌入框的nameQ默认gؓI。注意：在同一中出现多个日期输入框，不能有重复的nameQ?BR> this.display=display; //定义displayҎQ用来显C日期输入框?BR>}
function display() //定义dateSelector的displayҎQ它实C个日历Ş式的日期选择框?BR>{
var week=new Array('?,'一','?,'?,'?,'?,'?);
document.write("<style type=text/css>");
document.write(" .ds_font td,span { font: normal 12px 宋体; color: #000000; }");
document.write(" .ds_border { border: 1px solid #000000; cursor: hand; background-color: #DDDDDD }");
document.write(" .ds_border2 { border: 1px solid #000000; cursor: hand; background-color: #DDDDDD }");
document.write("</style>");
var M=new String(this.month);
var d=new String(this.date);
if(M.length==1&&d.length==1){
document.write("<input style='text-align:center;' id='DS_"+this.inputName+"' name='"+this.inputName+"' value='"+this.year+"-0"+this.month+"-0"+this.date+"' title=双击可进行编~?ondblclick='this.readOnly=false;this.focus()' onblur='this.readOnly=true' readonly>");}
else if(M.length==1&&d.length==2){
document.write("<input style='text-align:center;' id='DS_"+this.inputName+"' name='"+this.inputName+"' value='"+this.year+"-0"+this.month+"-"+this.date+"' title=双击可进行编~?ondblclick='this.readOnly=false;this.focus()' onblur='this.readOnly=true' readonly>");}
else if(M.length==2&&d.length==1){
document.write("<input style='text-align:center;' id='DS_"+this.inputName+"' name='"+this.inputName+"' value='"+this.year+"-"+this.month+"-0"+this.date+"' title=双击可进行编~?ondblclick='this.readOnly=false;this.focus()' onblur='this.readOnly=true' readonly>");}
else if(M.length==2&&d.length==2){
document.write("<input style='text-align:center;' id='DS_"+this.inputName+"' name='"+this.inputName+"' value='"+this.year+"-"+this.month+"-"+this.date+"' title=双击可进行编~?ondblclick='this.readOnly=false;this.focus()' onblur='this.readOnly=true' readonly>");}
document.write("<button style='width:60px;height:18px;font-size:12px;margin:1px;border:1px solid #A4B3C8;background-color:#DFE7EF;' type=button onclick=this.nextSibling.style.display='block' onfocus=this.blur()>选择日期</button>");
document.write("<div style='position:absolute;display:none;text-align:center;width:0px;height:0px;overflow:visible' onselectstart='return false;'>");
document.write(" <div style='position:absolute;left:-60px;top:20px;width:142px;height:165px;background-color:#F6F6F6;border:1px solid #245B7D;' class=ds_font>");
document.write(" <table cellpadding=0 cellspacing=1 width=140 height=20 bgcolor=#CEDAE7 onmousedown='DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();' onmouseup='releaseCapture();' onmousemove='dsMove(this.parentNode)' style='cursor:move;'>");
document.write(" <tr align=center>");
document.write(" <td width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=subYear(this) title='减小q䆾'><<</td>");
document.write(" <td width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=subMonth(this) title='减小月䆾'><</td>");
document.write(" <td width=52%><b>"+this.year+"</b><b>q?lt;/b><b>"+this.month+"</b><b>?lt;/b></td>");
document.write(" <td width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=addMonth(this) title='增加月䆾'>></td>");
document.write(" <td width=12% onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=addYear(this) title='增加q䆾'>>></td>");
document.write(" </tr>");
document.write(" </table>");
document.write(" <table cellpadding=0 cellspacing=0 width=140 height=20 onmousedown='DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();' onmouseup='releaseCapture();' onmousemove='dsMove(this.parentNode)' style='cursor:move;'>");
document.write(" <tr align=center>");
for(i=0;i<7;i++)
document.write(" <td>"+week[i]+"</td>");
document.write(" </tr>");
document.write(" </table>");
document.write(" <table cellpadding=0 cellspacing=2 width=140 bgcolor=#EEEEEE>");
for(i=0;i<6;i++)
{
document.write(" <tr align=center>");
for(j=0;j<7;j++)
document.write(" <td width=10% height=16 onmouseover=if(this.innerText!=''&&this.className!='ds_border2')this.className='ds_border' onmouseout=if(this.className!='ds_border2')this.className='' onclick=getValue(this,document.all('DS_"+this.inputName+"'))></td>");
document.write(" </tr>");
}
document.write(" </table>");
document.write(" <span style=cursor:hand onclick=this.parentNode.parentNode.style.display='none'>【关闭?lt;/span>");
document.write(" </div>");
document.write("</div>");
dateShow(document.all("DS_"+this.inputName).nextSibling.nextSibling.childNodes[0].childNodes[2],this.year,this.month)
}
function subYear(obj) //减小q䆾
{
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
myObj[0].innerHTML=eval(myObj[0].innerHTML)-1;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
function addYear(obj) //增加q䆾
{
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
myObj[0].innerHTML=eval(myObj[0].innerHTML)+1;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
function subMonth(obj) //减小月䆾
{
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
var month=eval(myObj[2].innerHTML)-1;
if(month==0)
{
month=12;
subYear(obj);
}
myObj[2].innerHTML=month;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
function addMonth(obj) //增加月䆾
{
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
var month=eval(myObj[2].innerHTML)+1;
if(month==13)
{
month=1;
addYear(obj);
}
myObj[2].innerHTML=month;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
function dateShow(obj,year,month) //昄各月份的?BR>{
var myDate=new Date(year,month-1,1);
var today=new Date();
var day=myDate.getDay();
var selectDate=obj.parentNode.parentNode.previousSibling.previousSibling.value.split('-');
var length;
switch(month)
{
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
length=31;
break;
case 4:
case 6:
case 9:
case 11:
length=30;
break;
case 2:
if((year%4==0)&&(year%100!=0)||(year%400==0))
length=29;
else
length=28;
}
for(i=0;i<obj.cells.length;i++)
{
obj.cells[i].innerHTML='';
obj.cells[i].style.color='';
obj.cells[i].className='';
}
for(i=0;i<length;i++)
{
obj.cells[i+day].innerHTML=(i+1);
if(year==today.getFullYear()&&(month-1)==today.getMonth()&&(i+1)==today.getDate())
obj.cells[i+day].style.color='red';
if(year==eval(selectDate[0])&&month==eval(selectDate[1])&&(i+1)==eval(selectDate[2]))
obj.cells[i+day].className='ds_border2';
}
}
function getValue(obj,inputObj) //把选择的日期传l输入框
{
var myObj=inputObj.nextSibling.nextSibling.childNodes[0].childNodes[0].cells[2].childNodes;
if(obj.innerHTML)
if(obj.innerHTML.length==1&&myObj[2].innerHTML.length==1)
inputObj.value=myObj[0].innerHTML+"-0"+myObj[2].innerHTML+"-0"+obj.innerHTML;
else if(obj.innerHTML.length==1&&myObj[2].innerHTML.length==2)
inputObj.value=myObj[0].innerHTML+"-"+myObj[2].innerHTML+"-0"+obj.innerHTML;
else if(obj.innerHTML.length==2&&myObj[2].innerHTML.length==1)
inputObj.value=myObj[0].innerHTML+"-0"+myObj[2].innerHTML+"-"+obj.innerHTML;
else if(obj.innerHTML.length==2&&myObj[2].innerHTML.length==2)
inputObj.value=myObj[0].innerHTML+"-"+myObj[2].innerHTML+"-"+obj.innerHTML;
inputObj.nextSibling.nextSibling.style.display='none';
for(i=0;i<obj.parentNode.parentNode.parentNode.cells.length;i++)
obj.parentNode.parentNode.parentNode.cells[i].className='';
obj.className='ds_border2'
}
function dsMove(obj) //实现层的拖移
{
if(event.button==1)
{
var X=obj.clientLeft;
var Y=obj.clientTop;
obj.style.pixelLeft=X+(event.x-DS_x);
obj.style.pixelTop=Y+(event.y-DS_y);
}
}
</script>
</head>
<body>
?nbsp;
<script language=javascript>
var myDate=new dateSelector();
myDate.year--;
myDate.inputName='start_date'; //注意q里讄输入框的nameQ同一中日期输入框，不能出现重复的name?BR> myDate.display();
</script>
?nbsp;
<script language=javascript>
myDate.year++;
myDate.inputName='end_date'; //注意q里讄输入框的nameQ同一中的日期输入框Q不能出现重复的name?BR> myDate.display();
</script>
</body>
</html>
for example:
var tag=document.getElementById("tdGrid")
tag.style.display="none"
or
tag.style.display="";
how easy that is!