把javascript从html完全抽出到底好不好？
0
悬赏园豆：10
[已解决问题]
解决于 2013-08-28 09:25
在项目实施中经常会遇到这种现象：
<ul><li><a id="btnClick" class="btn">确定</a></li></ul>
仅通过html根本没法看出事件是在哪绑定的。
在项目维护阶段，修改bug会先从html找起，来确定响应事件的dom元素，然后找到其触发的事件。但是上面的示例代码无法体现出事件是如何绑定的。有可能是通过id，也有可能是标签，还可能是jquery多层选择实现的。仅仅通过dom的id、class来搜索可能会搜索的多项结果。
如果在标签内部嵌入onclick="onBtnClick();"事件，就会很容易看出事件的绑定。但这不符合html与javascript分离的原则。
请各位大牛给予指点。
最佳答案
0
HTML是内容，JS是行为，HTML与JS分离可以带来的好处是便于开发和维护：
1、写HTML&CSS的人与写JS的人可以分工合作
2、当设备不支持JS时分开写不会报错
3、使网页源码看起来更简洁清晰
...
至于你说的看到事件是如何绑定的，是因为编码不规范导致的。
一般如果一个DOM元素上面有JS事件，都会在元素的ID或Class的命名中作特殊处理，常用的有以“J_”开头等，这就是传说中的JS钩子。这样做的好处是，看到ID或Class以“J_”开头的，就知道这个元素在JS中用到了，然后去查这个名字就OK了。
另外，现在很多开发者工具（如chrome developer tools）都提供了查看DOM元素上绑定的事件的能力:http://stackoverflow.com/questions/15928950/how-to-set-event-listener-breakpoints-in-chromes-elements-tab
收获园豆：8
感谢 artwl 的建议，如您所说，把ID或Class以“J_”开头的确可以区分是否在js中用到，这是一个好方法
以前看到淘宝的首页里有不少以J打头的id，不知道是什么原因，也怀疑过是javascript的缩写，现在知道了是js钩子的意思。
其他回答(4)
0
各有优缺点，就看楼主具体应用环境和取舍了。
个人拙见：易变化的部分用分开的方法比较灵活，不易变化的用标签内部嵌入方法易调试和查找bug.
收获园豆：1
感谢 Albert Fei 的建议，这是个好方法，因地制宜。有些表格内的确不适合每个td都绑定事件。
0
当然是抽出比较好，
好的原因上面的人说了几点，再补充一点是：
搜索爬虫不认js, 分离出来外链引入便于被搜索引擎抓取
但现实项目中往往很难实现，
这涉及到代码规范，项目管理，开发者的水平和责任心
收获园豆：1
0
一般来说，是抽出来更好，至于事件的跟踪问题，这个只要按照一定的约定去写，还是比较好跟踪了。
这样也符合非侵入式脚本的思想~
0
通常来说是分离的。能不绑定就不绑定在页面上。
不知道你是不是用vs来开发，如果是的话vs有个插件可以就看js而已。
一个页面不会有太多的js代码吧。代码多的话都会写外部了
