实例说明为什么不要行内使用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 相关文章推荐
关于setInterval、setTimeout在jQuery中的使用注意事项
Sep 28 Javascript
js给网页加上背景音乐及选择音效的方法
Mar 03 Javascript
深入解析JavaScript编程中的this关键字使用
Nov 09 Javascript
AngularJS转换响应内容
Jan 27 Javascript
使用bootstrap validator的remote验证代码经验分享(推荐)
Sep 21 Javascript
简易的JS计算器实现代码
Oct 18 Javascript
PHP获取当前页面完整URL的方法
Dec 02 Javascript
react+redux的升级版todoList的实现
Dec 18 Javascript
vue-cli中的babel配置文件.babelrc实例详解
Feb 22 Javascript
解决iView中时间控件选择的时间总是少一天的问题
Mar 15 Javascript
浅谈vue项目打包优化策略
Sep 29 Javascript
JS关闭子窗口并且刷新上一个窗口的实现示例
Mar 10 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命令行脚本接收传入参数的三种方式
2014/08/20 PHP
PHP中类的自动加载的方法
2017/03/17 PHP
JavaScript 三种创建对象的方法
2009/10/16 Javascript
菜鸟javascript基础资料整理2
2010/12/06 Javascript
laytpl 精致巧妙的JavaScript模板引擎
2014/08/29 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
基于JavaScript操作DOM常用的API小结
2015/12/01 Javascript
js实现背景图自适应窗口大小
2017/01/10 Javascript
解决vue-cli + webpack 新建项目出错的问题
2018/03/20 Javascript
Vue.js更改调试地址端口号的实例
2018/09/19 Javascript
mpvue 单文件页面配置详解
2018/12/02 Javascript
详解Vue前端生产环境发布配置实战篇
2019/05/07 Javascript
[01:22:42]2014 DOTA2华西杯精英邀请赛 5 24 DK VS LGD
2014/05/26 DOTA
[00:57]林俊杰助阵DOTA2亚洲邀请赛
2015/01/28 DOTA
[01:01:22]VGJ.S vs OG 2018国际邀请赛淘汰赛BO3 第一场 8.22
2018/08/23 DOTA
python删除指定类型(或非指定)的文件实例详解
2015/07/06 Python
深入源码解析Python中的对象与类型
2015/12/11 Python
python中abs&amp;map&amp;reduce简介
2018/02/20 Python
如何安装多版本python python2和python3共存以及pip共存
2018/09/18 Python
python3爬虫学习之数据存储txt的案例详解
2019/04/24 Python
python实现的config文件读写功能示例
2019/09/24 Python
tensorflow实现在函数中用tf.Print输出中间值
2020/01/21 Python
Python tkinter和exe打包的方法
2020/02/05 Python
详解Pycharm安装及Django安装配置指南
2020/09/15 Python
python中复数的共轭复数知识点总结
2020/12/06 Python
服装厂厂长职责
2013/12/16 职场文书
管理部副部长岗位职责范文
2014/03/09 职场文书
辅导员评语
2014/05/04 职场文书
党员教师四风问题整改措施思想汇报
2014/10/08 职场文书
2014年预算员工作总结
2014/12/05 职场文书
环卫处个人工作总结
2015/03/04 职场文书
酒会开场白大全
2015/06/01 职场文书
车间班组长竞聘书
2015/09/15 职场文书
PhpSpreadsheet中文文档 | Spreadsheet操作教程实例
2021/04/01 PHP
mysql对于模糊查询like的一些汇总
2021/05/09 MySQL
Python selenium模拟网页点击爬虫交管12123违章数据
2021/05/26 Python