JavaScript 元素的插入顺序以及动态加载js

*****************记录下今天的心得*****************

 

 

1.元素插入顺序

需求:异步从后台读取两个数据a和b,并动态加载到父容器x中,要求a必须在b的左边

实际情况:一开始是用x.append(...)的方法将a、b添加进去,由于是异步加载,查询速度快的请求自然会先显示在页面中的左边,于是最终列表中,a、b是忽左忽右的。

解决办法:使用 a.prependTo(x) 函数,应该好理解,就是始终把a插入到x的最前面。

 

2.动态加载js

需求:页面加载完毕后,设置页面控件的一些属性。前端的同事做好的静态页面,是在html末尾加上该段代码

$(function(){
    $("[data-toggle='tooltip']").tooltip();
})

 

 

实际情况:页面上的dom元素都是通过jquery异步请求后台后动态加载的,以上代码在文档载入完毕就执行了,而此时页面的相关dom元素还未创建。

解决办法:想办法让这段代码在dom元素创建完毕后执行,于是想到了动态js,在</body>前增加一个div

<div ></div>

   在创建dom的jquery代码后,加上这一段

var scriptStr="$(function(){$(\"[data-toggle='tooltip']\").tooltip(); })";//在需要的顺序中加载这段js代码
$("#div1").html("<br><script>"+scriptStr+"<\/script>");
 

大功告成

 

大小: 1.7 KB
32人参与, 0条评论 登录后显示评论回复

你需要登录后才能评论 登录/ 注册