1. <script language="javascript" type="text/javascript">
JS语句。
</script>
2. 引用外部的js文件
<script language="javascript" type="text/javascript" src="hello.js">
</script>
3. 点击按钮激活事件 通过链接调用函数
<input id="btn" type="button" value="点击" onclick="btn_click()"/>
ondblclick 双击
<a href="javascript:btn_click()">点击</a>
function btn_click()
{
alert("按了一下");
}
4. 确认用户的选择
var result=confirm("确定删除？");
点击“确定” result = true;
点击“取消” result = false;
5. 通过事件调用函数
页面加载完后，触发事件
<body onload="myFunction()">
</body>
6. 延时定时
function myFunction()
{
myTimeout=window.setTimeout("alert('时间到')",3000);
}
function myFunction2()
{
window.clearTimeout(myTimeout);
}
<body>
<input type="button" value="开始作答" onclick="myFunction()"/><br>
<hr>
<input type="button" value="A" onclick="myFunction2()"/>
<input type="button" value="B" onclick="myFunction2()"/>
<input type="button" value="C" onclick="myFunction2()"/>
</body>
7. onload 事件 网页中的所有内容都从服务器下载到浏览器后，触发该事件，保证文档完全加载后再进行其他操作。
<script language="javascript" type="text/javascript">
window.onload=myFunction; 不加括号，只要函数名
function myFunction(){
}
</script>
8. onblur 窗口失去焦点
onfocus 窗口获得焦点
9. 通过图片来链接
<a href="http://www.baidu.com" target="_blank"><img src="1.jpg"></a>
10. 修改文本框的值
<script language="javascript" type="text/javascript">
document.onmousedown=mouseDown;
document.onmouseup=mouseUp;
function mouseDown()
{
document.getElementById("txt1").value="按下";
document.getElementById("txt2").value="";
}
function mouseUp()
{
document.getElementById("txt2").value="弹起";
document.getElementById("txt1").value="";
}
</script>
<form name="myForm">
<input type="text" id="txt" value="">
</form>
<script language="javascript" type="text/javascript">
document.myForm.txt.value="xx"; 通过表单直接修改
</script>
11. 表单提交
<form name="myForm" action="javascript:alert('确定提交？');">
<input type="submit" id="txt" value="提交"> type必须为submit
</form>
12. 错误消息提示
document.getElementById("hello").innerHTML="Error";
<h1 id="hello"> </h1>
innerHTML是将等号右边的字符串放在指定标签的页面中。相当于
<h1 id="hello"> Error
</h1>
13. 在链接时调用javascript
<a href="javascript:function()">点击</a>
14. 暂停和时间间隔
可以用window对象的setTimeOut()方法设置暂停.两个参数：要执行的代码和在执行它之前要等待的毫秒数。
var outId = setTimeout(onLoad,2000);
function onLoad(){
document.write("Time");
}
取消还未执行的暂停，可以调用clearTimeOut()方法。clearTimeOut(outId) 把ID传过去。
时间间隔，它无限次地每隔指定时间段就重复一次指定的代码。 setinterval() clearInterval()
15. 后退 前进
<a href="javascript:bhistory.go(-1);">后退</a> history.back()
<a href="javascript:bhistory.go(1);">前进</a> history.forward() 效果一样
16. location.href 改变该属性的值，可导航到新页面
location.reload()重载页面 参数为false 则从缓存中载入，如果为true 则从服务器端载入。默认false
17. 在JavaScript中分配事件处理函数，要获得要处理的对象的引用
var img=document.getElementById("img");
img.onclick=function (){
img.src="e.jpg";
}
//在IE中添加多个事件处理函数
function myFunction()
{
alert("Click Me");
}
function myFunction2()
{
var im=document.getElementById("img");
im.attachEvent("onclick",myFunction);
//do something
im.detachEvent("onclick",myFunction);
}
DOM方法 addEventListener()和removeEventListener()
18. 改变某个东西的外观
<img src="image1.gif" onmouseover="this.src='image2.gif'" onmouseout="this.src='image1.gif'"
19. 鼠标提示
<a href="http://www.baidu.com" title="baidu">百度</a> 将鼠标移动上去就会有提示
如果你想自定义特别的鼠标提示，则可以创建隐藏的<div />来实现。
function showTip(event)
{
var oDiv=document.getElementById("divTip1");
oDiv.style.visibility="visible";
oDiv.style.left=event.clientX+5;
oDiv.style.top=event.clientY+5;
}
function hideTip(event)
{
var oDiv=document.getElementById("divTip1");
oDiv.style.visibility="hidden";
}
<div id="div1" style="background-color:red;height:50px;width:50px"
onmouseover="showTip(event)" onmouseout="hideTip(event)">
</div>
<div id="divTip1"style="backgroundcolor:yellow;position:absolute;visibility:hidden;padding:5px">
<span style="font-weight:bold">Custom Tooltip</span><br/>
More details can go here
</div>
20. 可折叠区域
function toggle(sDivId)
{
var oDiv=document.getElementById(sDivId);
oDiv.style.display=(oDiv.style.display=="none")?"block":"none";
}
<div style="background-color:Blue; color:White; font-weight:bold; padding:10px; cursor:pointer;"
onclick="toggle('divContent1')">Click Here
</div>
<div id="divContent1" style="border:3px solid blue; height:100px; padding:10px">
This is some
</div>
<p> </p>
<div style="background-color:Blue; color:White; font-weight:bold; padding:10px; cursor:pointer;"
onclick="toggle('divContent2')">Click Here
</div>
<div id="divContent2" style="border:3px solid blue; height:100px; padding:10px">
This is some
</div>
21. 表单仅提交一次
<input type="button" value="submit" onclick="this.disable=true;this.form.submit()">
22.
发表评论
-
精通JavaScript
2011-03-12 21:15 6791. 类型检查 （1）使用typeof var ... -
JavaScript 高级程序设计 客户端与服务器端的通信
2011-03-10 09:57 7241. 异步载入文件时，要使用readyState特性和onre ... -
JavaScript 高级程序设计 表单和数据完整性
2011-03-08 21:38 6941. 创建表单是为了满足用户向服务器发送数据的需求。 ... -
JavaScript 高级程序设计 BOM/DOM基础
2011-03-06 15:59 7981. 将JavaScript代码写在单独的js文件中，浏览器会 ... -
JavaScript 高级程序设计 继承
2011-03-03 10:56 7071. 对象冒充 function Cla ... -
JavaScript 高级程序设计 对象基础
2011-02-28 14:28 7571. 一个完整的JavaScript实现的3个不同组成部分 ... -
JavaScript 内置对象和全局函数
2011-02-23 18:39 8761. navigator ： 对象通常用于检测浏览器与操 ... -
JavaScript网页编程从入门到精通
2011-02-23 18:35 5951. function myFunction(x,y,z) ... -
JavaScript && Java
2011-02-23 18:12 644JavaScript的基本特点 1. JavaScrip ... -
零基础学JavaScript(一)
2011-01-17 12:53 7581. 脚本语言不需要事先 ...
相关推荐
JavaScript常用代码集锦 JavaScript常用代码集锦 JavaScript常用代码集锦
javascript 常用代码大全javascript 常用代码大全javascript 常用代码大全javascript 常用代码大全
JavaScript常用语句精选，B/S中常用的
JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件JavaScript常用事件...
JavaScript常用代码大全
常用js代码公用方法
javascript常用方法，javascript常用判断，javascript实用命令，javascript常用函数集，javascript常用55个技巧，javascript深度剖析，107个常用的javascript语句.
javascript常用方法javascript常用方法javascript常用方法javascript常用方法javascript常用方法
这个是个人总结整理的javascript 常用方法，居家旅行敲代码的必备神器。
常用JavaScript特效常用JavaScript特效常用JavaScript特效常用JavaScript特效常用JavaScript特效常用JavaScript特效常用JavaScript特效常用JavaScript特效 很好的东东
JavaScript常用运算符和操作符总结（教辅）JavaScript常用运算符和操作符总结（教辅）JavaScript常用运算符和操作符总结（教辅）JavaScript常用运算符和操作符总结（教辅）JavaScript常用运算符和操作符总结（教辅）...
javascript常用特效(三大资源).javascript常用特效(三大资源).
javascript常用正则表达式大全,基本覆盖基本需求的正则表达式
javascript常用函数集合 javascript常用函数集合 javascript常用函数集合
javascript常用判断函数大全 javascript常用判断函数 javascript常用判断函数
\javascript常用代码大全.doc
Javascript常用脚本归类Javascript常用脚本归类Javascript常用脚本归类Javascript常用脚本归类Javascript常用脚本归类Javascript常用脚本归类
txt文件，荟萃了javascript很多的效果跟应用，适用新手学习，老手参考。
Javascript常用对象Javascript常用对象Javascript常用对象Javascript常用对象Javascript常用对象
常用javascript案例大全，包括最常用的javascript应用案例