实例说明为什么不要行内使用javascript


Posted in Javascript onApril 18, 2014

很多人都曾经这么使用Javascript

<a href="#" onclick="al()">保存</a>

上面的代码,很方便使用,所有浏览器都支持

虽然我很早就看过一些书,说html,css,js分开来,比较容易维护,但是我贪图方面,还是经常这么写,不过我今天用火狐调试的时候发现,还是不要行内写了,因为这样很不安全,因为用火狐的firebug可以轻松让代码失效!

下面看一下为什么:

<html> 
<head> 
<script> 
function al() 
{ 
alert("good"); 
} 
</script> 
</head> 
<body> 
<a href="#" onclick="al()">保存</a> 
</body> 
</html>

上面的代码是点击标签弹出对话框

效果如图:
实例说明为什么不要行内使用javascript 

但是如果我在火狐里面找到a标签并把里面的js代码去掉的话,在单击a标签就不会弹出对话框了,如下图
实例说明为什么不要行内使用javascript 

所以假如你这个单击事件是判断用户输入数据是否合法的话,那么就无法判断了

本人是做asp.net的,今天就发现这个问题,因为asp.net服务器控件,有两个单击事件,一个前台一个后台的,我用前台的单击事件判断用户的输入数据,合法的话调用后台事件,结果用火狐调试,就发现了上面介绍的现象,即使数据不合法也直接调用后台方法了,也许我这个不是什么技术,不过我为自己发现这个问题而高兴,特此发文章分享一下,哈哈

解决方法:

给a标签个id ,如下面就可以了

<a id="a1" href="#">保存</a> 
<script> 
document.getElementById("a1").onclick=function(){} 
</script>
Javascript 相关文章推荐
提高网站性能之 如何对待JavaScript
Oct 31 Javascript
javascript 面向对象的JavaScript类
May 04 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
May 19 Javascript
用javascript读取xml文件读取节点数据
Aug 12 Javascript
javascript动态设置样式style实例分析
May 13 Javascript
vue-music关于Player播放器组件详解
Nov 28 Javascript
详解angularjs跨页面传参遇到的一些问题
Nov 01 Javascript
GOJS+VUE实现流程图效果
Dec 01 Javascript
让 babel webpack vue 配置文件支持智能提示的方法
Jun 22 Javascript
什么时候不能在 Node.js 中使用 Lock Files
Jun 24 Javascript
微信小程序实现分享商品海报功能
Sep 30 Javascript
使用webpack搭建pixi.js开发环境
Feb 12 Javascript
自制的文件上传JS控件可支持IE、chrome、firefox etc
Apr 18 #Javascript
禁用Tab键JS代码兼容Firefox和IE
Apr 18 #Javascript
JQuery each()嵌套使用小结
Apr 18 #Javascript
JavaScript编程的10个实用小技巧
Apr 18 #Javascript
jquery库或JS文件在eclipse下报错问题解决方法
Apr 17 #Javascript
js截取中英文字符串、标点符号无乱码示例解读
Apr 17 #Javascript
jQuery中对未来的元素绑定事件用bind、live or on
Apr 17 #Javascript
You might like
PHP XML error parsing SOAP payload on line 1
2010/06/17 PHP
php查看一个变量的占用内存的实例代码
2020/03/29 PHP
用jquery实现输入框获取焦点消失文字
2013/04/27 Javascript
JavaScript数组常用方法
2015/03/02 Javascript
JS实现的车标图片提示效果代码
2015/10/10 Javascript
JavaScript引用类型和基本类型详解
2016/01/06 Javascript
自定义PC微信扫码登录样式写法
2017/12/12 Javascript
Vue+SpringBoot开发V部落博客管理平台
2017/12/27 Javascript
微信小程序点击保存图片到本机功能
2019/12/13 Javascript
JS数组方法push()、pop()用法实例分析
2020/01/18 Javascript
[01:59]DOTA2首部纪录片《Free to play》预告片
2014/03/12 DOTA
[46:32]Fnatic vs OG 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
Python的Urllib库的基本使用教程
2015/04/30 Python
Python 3.x 新特性及10大变化
2015/06/12 Python
python 多线程实现检测服务器在线情况
2015/11/25 Python
基于python爬虫数据处理(详解)
2017/06/10 Python
python+PyQT实现系统桌面时钟
2020/06/16 Python
Python学习笔记之图片人脸检测识别实例教程
2019/03/06 Python
python3爬虫学习之数据存储txt的案例详解
2019/04/24 Python
Python计算机视觉里的IOU计算实例
2020/01/17 Python
在Tensorflow中实现梯度下降法更新参数值
2020/01/23 Python
python目标检测给图画框,bbox画到图上并保存案例
2020/03/10 Python
pytorch使用horovod多gpu训练的实现
2020/09/09 Python
Hotels.com香港酒店网:你的自由行酒店订房专家
2018/01/22 全球购物
伦敦高达60%折扣的钻石珠宝商:Purely Diamonds
2018/06/24 全球购物
skyn ICELAND官网:冰岛成分天然护肤品
2020/08/24 全球购物
资深财务管理人员自我评价
2013/09/22 职场文书
人事科岗位职责范本
2014/03/02 职场文书
2014大学生职业生涯规划书最新范文
2014/09/13 职场文书
小学生校园广播稿
2014/09/28 职场文书
婚姻出轨保证书
2015/05/08 职场文书
个人道歉信大全
2019/04/11 职场文书
oracle DGMGRL ORA-16603报错的解决方法(DG Broker)
2021/04/06 Oracle
windows下快速安装nginx并配置开机自启动的方法
2021/05/11 Servers
JavaScript流程控制(循环)
2021/12/06 Javascript
Win2008系统搭建DHCP服务器
2022/06/25 Servers