HTML添加js
方法一:html文件body标签中加入
<html> <body> <script type="text/javascript"> document.write("Hello World!"); </script> </body> </html>当页面载入时,会执行位于 body 部分的 JavaScript。
方法二:html文件head标签中加入
<html> <head> <script type="text/javascript"> function message() { alert("该提示框是通过 onload 事件调用的。") } </script> </head> <body onload="message()"> </body> </html>
当用户触发事件时才执行脚本
方法三:使用外部JavaScript
<html> <head> <script src="xxx.js">....</script> </head> <body> </body> </html>
在若干个页面中运行 JavaScript,同时不在每个页面中写相同的脚本。可以将 JavaScript 写入一个外部文件之中。然后以 .js 为后缀保存这个文件。外部文件不能包含 <script> 标签。
注释多行注释以 /* 开头,以 */ 结尾。
声明(创建) 变量
var x=5;
注释:由于 JavaScript 对大小写敏感,变量名也对大小写敏感。
警告框alert("再次向您问好!在这里,我们向您演示" + '\n' + "如何向警告框添加折行。")
确认框<html> <head> <script type="text/javascript"> function show_confirm(){ var r=confirm("Press a button!"); if (r==true){ alert("You pressed OK!"); }else{ alert("You pressed Cancel!"); } } </script> </head> <body> <input type="button" onclick="show_confirm()" value="Show a confirm box" /> </body> </html>
提示框
<html> <head> <script type="text/javascript"> function disp_prompt() { var name=prompt("请输入您的名字","Bill Gates") if (name!=null && name!="") { document.write("你好!" + name + " 今天过得怎么样?") } } </script> </head> <body> <input type="button" onclick="disp_prompt()" value="显示提示框" /> </body> </html>提示框经常用于提示用户在进入页面前输入某个值。当提示框出现后,用户需要输入某个值,然后点击确认或取消按钮才能继续操纵。如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null。
定义函数
1、有参数语法:var1, var2 等指的是传入函数的变量或值。{ 和 } 定义了函数的开始和结束。
2、无参数的函数必须在其函数名后加括号:注意:别忘记 JavaScript 中大小写字母的重要性。"function" 这个词必须是小写的,否则 JavaScript 就会出错。另外需要注意的是,必须使用大小写完全相同的函数名来调用函数。
3、有返回值函数
}
break 和 continue 语句continue 命令会终止当前的循环,然后从下一个值继续运行。
for...in 语句
for...in 语句用于对数组或者对象的属性进行循环操作。
for ... in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。<html> <body> <script type="text/javascript"> var x var mycars = new Array() mycars[0] = "Saab" mycars[1] = "Volvo" mycars[2] = "BMW" for (x in mycars){ document.write(mycars[x] + "<br />") } </script> </body> </html>
事件
事件是可以被 JavaScript 侦测到的行为。注意:事件通常与函数配合使用,当事件发生时函数才会执行。
onload 和 onUnload当用户进入或离开页面时就会触发 onload 和 onUnload 事件。
onload 事件常用来检测访问者的浏览器类型和版本,然后根据这些信息载入特定版本的网页。onFocus, onBlur 和 onChange
onFocus、onBlur 和 onChange 事件通常相互配合用来验证表单。onSubmit
onSubmit 用于在提交表单之前验证所有的表单域。onMouseOver 和 onMouseOut
onMouseOver 和 onMouseOut 用来创建“动态的”按钮。</a>
事件通常与函数配合使用,这样就可以通过发生的事件来驱动函数执行。FF: Firefox, N: Netscape, IE: Internet Explorer
属性 | 以下情况发生,出现此事件 | FF | N | IE |
onabort | 图像加载被中断 | 1 | 3 | 4 |
onblur | 元素失去焦点 | 1 | 2 | 3 |
onchange | 用户改变域的内容 | 1 | 2 | 3 |
onclick | 鼠标点击某个对象 | 1 | 2 | 3 |
ondblclick | 鼠标双击某个对象 | 1 | 4 | 4 |
onerror | 当加载文档或图像时发生某个错误 | 1 | 3 | 4 |
onfocus | 元素获得焦点 | 1 | 2 | 3 |
onkeydown | 某个键盘的键被按下 | 1 | 4 | 3 |
onkeypress | 某个键盘的键被按下或按住 | 1 | 4 | 3 |
onkeyup | 某个键盘的键被松开 | 1 | 4 | 3 |
onload | 某个页面或图像被完成加载 | 1 | 2 | 3 |
onmousedown | 某个鼠标按键被按下 | 1 | 4 | 4 |
onmousemove | 鼠标被移动 | 1 | 6 | 3 |
onmouseout | 鼠标从某元素移开 | 1 | 4 | 4 |
onmouseover | 鼠标被移到某元素之上 | 1 | 3 | 4 |
onmouseup | 某个鼠标按键被松开 | 1 | 4 | 4 |
onreset | 重置按钮被点击 | 1 | 3 | 4 |
onresize | 窗口或框架被调整尺寸 | 1 | 4 | 4 |
onselect | 文本被选定 | 1 | 2 | 3 |
onsubmit | 提交按钮被点击 | 1 | 2 | 3 |
onunload | 用户退出页面 | 1 | 2 | 3 |
两种在网页中捕获错误的方法:
使用 try...catch 语句。(在 IE5+、Mozilla 1.0、和 Netscape 6 中可用)使用 onerror 事件。这是用于捕获错误的老式方法。(Netscape 3 以后的版本可用)
注意:chrome、opera 和 safari 浏览器不支持 onerror 事件。Try...Catch 语句
try...catch 可以测试代码中的错误。try 部分包含需要运行的代码,而 catch 部分包含错误发生时运行的代码。
语法:Throw 声明
throw 声明的作用是创建 exception(异常)。你可以把这个声明与 try...catch 声明配合使用,以达到控制程序流并产生精确错误消息的目的。<html> <body> <script type="text/javascript"> var x=prompt("Enter a number between 0 and 10:","") try{ if(x>10) throw "Err1" else if(x<0) throw "Err2" } catch(er){ if(er=="Err1") alert("Error! The value is too high") if(er == "Err2") alert("Error! The value is too low") } </script> </body> </html>
onerror 事件
<html> <head> <script type="text/javascript"> onerror=handleErr var txt="" function handleErr(msg,url,l){ txt="There was an error on this page.\n\n" txt+="Error: " + msg + "\n" txt+="URL: " + url + "\n" txt+="Line: " + l + "\n\n" txt+="Click OK to continue.\n\n" alert(txt) return true } function message(){ adddlert("Welcome guest!") } </script> </head> <body> <input type="button" value="View message" onclick="message()" /> </body> </html>
插入特殊字符
反斜杠用来在文本字符串中插入省略号、换行符、引号和其他特殊字符。