繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Javascript事件处理代码的三种写法
- Javascript
- AJAX教程(14)：通过XMLHTTP加载XML文件
- AJAX教程(15)：通过XMLHTTP进行一次HEAD请求
- AJAX教程(16)：通过XMLHTTP进行一次指定的HEAD请求
- AJAX教程(17)：把XML文件显示为HTML表格
- JS通过WMI获取客户端硬件信息
- JavaScript中使用远程脚本
- 关于Ajax技术的注意事项
- XMLHttpRequest创建智能表单
- iframe创建智能表单
- JS教程:线小测试程序
- 在Web页面中使用计时器
- 将事件处理器作为HTML标记的属性
- 事件处理器作为浏览器对象的属性
- Math对象应用详解
- random()方法和pow()方法
- charAt()方法和charCodeAt()方法
- Number对象常用的toFixed()方法
- JS教程:为什么尽量用局部变量代替全局变量
- 解决JavaScript循环中的过多操作
- 处理提示“脚本运行时间过长的提示框”问题
Javascript事件处理代码的三种写法
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-28 浏览: 329 ::
收藏到网摘: n/a
1.作为HTML属性值的事件处理程序
HTML代码
<input name="btn" type="button" id="btn" value="按钮" onclick="alert('mzwu.com');" />
2.作为JavaScript属性的事件处理程序
HTML代码
<input name="btn" type="button" id="btn" value="按钮" />
<script language="javascript">
document.getElementById("btn").onclick = function(){alert("mzwu.com");}
</script>
说明：可能受第一种方法的误导，你会觉得应该写成：document.getElementById("btn").onclick() = "alert('mzwu.com');"，这样写是错误的！其实第一种方法隐式的创建了一个函数，使用下边代码可以说明这一点，因为它检测出HTML属性值其实是一个函数：
HTML代码
<input name="btn" type="button" id="btn" value="按钮" onclick="alert(typeof(this.onclick));" />
上边是用直接量来创建函数，改成用function()语句的写法：
HTML代码
<input name="btn" type="button" id="btn" value="按钮" />
<script language="javascript">
function e()
{
alert("mzwu.com");
}
document.getElementById("btn").onclick = e;
</script>
由此我们可引申出第三种方法。
3.第三种方法
HTML代码
<input name="btn" type="button" id="btn" value="按钮" />
<script language="javascript">
function document.all.btn.onclick()
{
alert("mzwu.com");
}
</script>
说明：诸如此类的方法还有function document.onclick(){}，但这种方法在IE、FF中测试只有IE下可行，再改成function document.getElementById("btn").onclick(){}在IE、FF下都不行了，提示缺少标识符，其实这也不难解释，因为JavaScript标识符中本来就不允许出现点号，用document.getElementById("btn").onclick做标识符显然是错误的，但document.all.btn.onclick却又可以实在有点让人费解。
评论 (0) All
