实例说明为什么不要行内使用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 Zifa FormValid 0.1表单验证 代码打包下载
Jun 08 Javascript
Extjs入门之动态加载树代码
Apr 09 Javascript
javascript学习(一)构建自己的JS库
Jan 02 Javascript
复选框全选与全不选操作实现思路
Aug 18 Javascript
angularjs基础教程
Dec 25 Javascript
jquery实现右键菜单插件
Mar 29 Javascript
BootStrap网页中代码显示用法详解
Oct 21 Javascript
js实现类bootstrap模态框动画
Feb 07 Javascript
Vue+jquery实现表格指定列的文字收缩的示例代码
Jan 09 jQuery
详解webpack 热更新优化
Sep 13 Javascript
vuejs移动端实现div拖拽移动
Jul 25 Javascript
js实现贪吃蛇游戏(简易版)
Sep 29 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伪静态页面函数附使用方法
2008/06/20 PHP
php版本的cron定时任务执行器使用实例
2014/08/19 PHP
php定义一个参数带有默认值的函数实例分析
2015/03/16 PHP
PHP实现的登录,注册及密码修改功能分析
2016/11/25 PHP
php 判断IP为有效IP地址的方法
2018/01/28 PHP
jquery.validate分组验证代码
2011/03/17 Javascript
获取body标签的两种方法
2011/10/13 Javascript
JS实现两个大数(整数)相乘
2014/04/28 Javascript
jquery访问ashx文件示例代码
2014/08/11 Javascript
JavaScript 消息框效果【实现代码】
2016/04/27 Javascript
使用JS中的exec()方法构造正则表达式验证
2016/08/01 Javascript
JS根据生日月份和日期计算星座的简单实现方法
2016/11/24 Javascript
判断横屏竖屏(三种)
2017/02/13 Javascript
轻松理解JavaScript之AJAX
2017/03/15 Javascript
jQuery实现下拉菜单动态添加数据点击滑出收起其他功能
2018/06/14 jQuery
浅谈Node 异步IO和事件循环
2019/05/05 Javascript
vue动态注册组件实例代码详解
2019/05/30 Javascript
js图片查看器插件用法示例
2019/06/22 Javascript
Python version 2.7 required, which was not found in the registry
2014/08/26 Python
Pyqt实现无边框窗口拖动以及窗口大小改变
2018/04/19 Python
Python爬取数据并写入MySQL数据库的实例
2018/06/21 Python
python 字符串的驻留机制及优缺点
2020/06/19 Python
Python3 ffmpeg视频转换工具使用方法解析
2020/08/10 Python
python中_del_还原数据的方法
2020/12/09 Python
html5视频常用API接口的实战示例
2020/03/20 HTML / CSS
欧洲顶级体育电子商务网站:SportsShoes.com
2018/03/27 全球购物
英国探险旅游专家:Explore
2018/12/20 全球购物
什么是Deployment descriptors;都有什么类型的部署描述符
2015/07/28 面试题
华为C++笔试题
2014/08/05 面试题
自荐信的禁忌和要点
2013/10/15 职场文书
先进个人获奖感言
2014/01/24 职场文书
售房协议书
2014/08/19 职场文书
幼儿园中班教育随笔
2015/08/14 职场文书
《学会生存》读后感3篇
2019/12/09 职场文书
Python的flask接收前台的ajax的post数据和get数据的方法
2021/04/12 Python
Python中npy和mat文件的保存与读取
2022/04/24 Python