现在加载局部页面几乎抛弃了 iframe ,使用 jquery load 或者 pjax 来加载,但是局部页面上面的 js 逻辑代码你们是怎么处理的呢??
方案一:全局实现 之前有看过 github 的实现,他们加载局部页面的时候不携带 js 代码。应该是放在全局页面进行处理的,但是这样的话 有些局部页面中的组件需要等待加载后才能初始化 难道每一次加载局部页面都要去初始化一次呢? 还有把所有局部页面的逻辑放在全局中 会不会不好维护呢?
方案二:局部实现 最简单粗暴, 把局部页面中的逻辑 js 放在局部页面中,
<div class='container'>
Hello
</div>
<script>
$(function(){
$('.container').html('World')
})
</script>
这样看起来 js 代码比较好维护,但是在浏览器中每点击一次都会重复的加载一次 js 代码,如果有 on 事件的话会重复进行添加,要解决重复添加 必须在 on 事件之前 取消一次事件绑定。 因为 js 加载到浏览器中没办法进行释放。
个人感觉第一种方案比较合理,但是不方便维护和开发,第二种方案简单粗暴 但是隐藏的问题很多
现在 vue 和 angular 好像都是加载局部页面不加载 js 代码 ,所以请教下各位。
1
MinonHeart 2017-02-09 23:50:15 +08:00 via iPhone
全局实现用委托就可以了
2 的话,你更新不会把 div 替换掉?替换就没有重复绑定的问题了。 最好把逻辑层和行为层(那些事件)分开,事件一般只要绑定一次就行了 |
2
yimity 2017-02-11 20:56:46 +08:00 via iPhone
第一没有所谓的 pjax ,第二,第一种方案推荐。好维护,初始化等逻辑都是在 JS 中控制。完全有你
|
3
yumemor OP |