JavaScript 三种不同位置代码的写法


Posted in Javascript onOctober 25, 2009

下面列举在三种不同的地方写JavaScript代码,实现的效果都是点击按钮button弹出alert警告框

第一种是最常见的,代码如下
html代码
<input type="button" value="按钮1" id="btn1" onclick="pop()">
js代码
function pop()
{
alert("在JavaScript函数处调用");
}

第二种是最简单的实现方式,代码如下
<input type="button" value="按钮2" id="btn2" onclick="javascript:alert('直接写函数');">

第三种方式相对复杂,代码如下
html代码
<input type="button" value="按钮3" id="btn3">
js代码
var obj=document.getElementById("btn3");//以下语句一定要放在定义btn3的下面,否则编译器是不能识别btn3的。
if(window.addEventListener)// Mozilla, Netscape, Firefox等浏览器
{
obj.addEventListener("click",fun,false);//注意这里的false
}
else //IE浏览器
{
obj.attachEvent("onclick",fun);
}
function fun()
{
alert("通过在函数中触发事件");
}

总结:三种写法方式实现的效果是完全一样的,应该说三种方式都是常用的,而且各有优缺点。。。。

Javascript 相关文章推荐
符合W3C网页标准的iframe标签的使用方法
Jul 19 Javascript
document.compatMode介绍
May 21 Javascript
浅谈jQuery异步对象(XMLHttpRequest)
Nov 17 Javascript
JS交换变量的方法
Jan 21 Javascript
本人自用的global.js库源码分享
Feb 28 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
Oct 28 Javascript
原生JS+CSS实现炫酷重力模拟弹跳系统的登录页面
Nov 01 Javascript
JS html事件冒泡和事件捕获操作示例
May 01 Javascript
使用apifm-wxapi模块中的问题及解决方法
Aug 05 Javascript
关于layui时间回显问题的解决方法
Sep 24 Javascript
AJAX XMLHttpRequest对象创建使用详解
Aug 20 Javascript
解决vue项目axios每次请求session不一致的问题
Oct 24 Javascript
JavaScript 事件的一些重要说明
Oct 25 #Javascript
javascript写的一个链表实现代码
Oct 25 #Javascript
JavaScript的变量作用域深入理解
Oct 25 #Javascript
理解JavaScript变量作用域更轻松
Oct 25 #Javascript
理解 JavaScript 预解析
Oct 25 #Javascript
WEB页子窗口(showModalDialog和showModelessDialog)使用说明
Oct 25 #Javascript
JavaScript弹簧振子超简洁版 完全符合能量守恒,胡克定理
Oct 25 #Javascript
You might like
php中substr()函数参数说明及用法实例
2014/11/15 PHP
laravel 获取当前url的别名方法
2019/10/11 PHP
Javascript 函数对象的多重身份
2009/06/28 Javascript
jQuery UI Autocomplete 体验分享
2012/02/14 Javascript
js setTimeout 参数传递使用介绍
2013/08/13 Javascript
javascript预加载图片、css、js的方法示例介绍
2013/10/14 Javascript
JQuery实现的按钮倒计时效果
2015/12/23 Javascript
Angular.js初始化之ng-app的自动绑定与手动绑定详解
2017/07/31 Javascript
Angularjs渲染的 using 指令的星级评分系统示例
2017/11/09 Javascript
利用Javascript开发一个二维周视图日历
2017/12/14 Javascript
JavaScript设计模式之模板方法模式原理与用法示例
2018/08/07 Javascript
vue-quill-editor+plupload富文本编辑器实例详解
2018/10/19 Javascript
JS实现移动端在线签协议功能
2019/08/22 Javascript
微信小程序实现watch监听
2020/06/04 Javascript
[03:42]2014DOTA2西雅图国际邀请赛7月9日TOPPLAY
2014/07/09 DOTA
python实现k均值算法示例(k均值聚类算法)
2014/03/16 Python
OpenCV2.3.1+Python2.7.3+Numpy等的配置解析
2018/01/05 Python
利用python为运维人员写一个监控脚本
2018/03/25 Python
Python实现的从右到左字符串替换方法示例
2018/07/06 Python
Django 限制用户访问频率的中间件的实现
2018/08/23 Python
Python人脸识别第三方库face_recognition接口说明文档
2019/05/03 Python
python多任务之协程的使用详解
2019/08/26 Python
opencv设置采集视频分辨率方式
2019/12/10 Python
python 字段拆分详解
2019/12/17 Python
keras 多gpu并行运行案例
2020/06/10 Python
Django def clean()函数对表单中的数据进行验证操作
2020/07/09 Python
如何把python项目部署到linux服务器
2020/08/26 Python
html5 figure和figcaption的使用方法
2018/09/10 HTML / CSS
神话般的珠宝:Ross-Simons
2020/07/13 全球购物
Shell编程面试题
2012/05/30 面试题
小学家长评语大全
2014/04/16 职场文书
省级优秀毕业生主要事迹
2014/05/29 职场文书
上党课的心得体会
2014/09/02 职场文书
向国旗敬礼学生寄语大全
2014/09/30 职场文书
党员批评与自我批评发言稿
2014/10/14 职场文书
2014年学校工会工作总结
2014/12/06 职场文书