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 相关文章推荐
如何在一个页面显示多个百度地图
Apr 07 Javascript
javascript时间函数大全
Jun 30 Javascript
取得元素的左和上偏移量的方法
Sep 17 Javascript
jQuery多媒体插件jQuery Media Plugin使用详解
Dec 19 Javascript
JavaScript函数的调用以及参数传递
Oct 21 Javascript
Vue.js教程之计算属性
Nov 11 Javascript
jQuery动态生成表格及右键菜单功能示例
Jan 13 Javascript
javascript容错处理代码(屏蔽js错误)
Jan 20 Javascript
react-native 圆弧拖动进度条实现的示例代码
Apr 12 Javascript
在NPM发布自己造的轮子的方法步骤
Mar 09 Javascript
利用Electron简单撸一个Markdown编辑器的方法
Jun 10 Javascript
vue使用高德地图点击下钻上浮效果的实现思路
Oct 12 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实现执行某一操作时弹出确认、取消对话框
2013/12/30 PHP
php加密算法之实现可逆加密算法和解密分享
2014/01/21 PHP
ThinkPHP3.2.2的插件控制器功能简述
2014/07/09 PHP
PHP采用curl模仿用户登陆新浪微博发微博的方法
2014/11/07 PHP
js自动闭合html标签(自动补全html标记)
2012/10/04 Javascript
利用JS延迟加载百度分享代码,提高网页速度
2013/07/01 Javascript
使用C++为node.js写扩展模块
2015/04/22 Javascript
JavaScript生成福利彩票双色球号码
2015/05/15 Javascript
全面介绍javascript实用技巧及单竖杠
2016/07/18 Javascript
JS for循环中i++ 和 ++i的区别介绍
2016/07/20 Javascript
基于Bootstrap实现的下拉菜单手机端不能选择菜单项的原因附解决办法
2016/07/22 Javascript
JS控制静态页面传递参数并获取参数应用
2016/08/10 Javascript
jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)
2016/11/09 Javascript
浅谈JavaScript的计时器对象
2016/12/26 Javascript
JavaScript数组复制详解
2017/02/02 Javascript
React-router中结合webpack实现按需加载实例
2017/05/25 Javascript
JS中利用swiper实现3d翻转幻灯片实例代码
2017/08/25 Javascript
对Vue table 动态表格td可编辑的方法详解
2018/08/28 Javascript
layui 实现二级弹窗弹出之后 关闭一级弹窗的方法
2019/09/18 Javascript
json字符串对象转换代码实例
2019/09/28 Javascript
Python多线程编程(四):使用Lock互斥锁
2015/04/05 Python
关于Python如何避免循环导入问题详解
2017/09/14 Python
jupyter notebook的安装与使用详解
2020/05/18 Python
基于CSS3 animation动画属性实现轮播图效果
2017/09/12 HTML / CSS
css3 实现元素弧线运动的示例代码
2020/04/24 HTML / CSS
爱尔兰最大的体育零售商:Life Style Sports
2019/06/12 全球购物
中专毕业生的自我鉴定
2013/12/01 职场文书
《黄河颂》教学反思
2014/02/07 职场文书
阳光体育活动方案
2014/02/16 职场文书
二手房买卖协议书
2014/04/10 职场文书
规范化管理年活动总结
2014/08/29 职场文书
关于运动会广播稿200字
2014/10/08 职场文书
2015年库房工作总结
2015/04/30 职场文书
走进毛泽东观后感
2015/06/04 职场文书
你有一份《诚信考试承诺书》待领取
2019/11/13 职场文书
win11电脑关机鼠标灯还亮怎么解决? win11关机后鼠标灯还亮解决方法
2023/01/09 数码科技