给<script>设置type="text/template",标签里面的内容不会被执行,也不会显示在页面上,但是可以在另一个script里面通过获取,然后再通过相关的模板工具进行处理,插入到页面中。这样就把大段的HTML操作从js里面分离开了。
<html> <head> <script ></script>//下面的js地址 <script class="t" type="text/template"> <tr id="c"> <td><button class="m" id="n">value</button></td> </tr> </script> </head> <body> <table class="e"></table> </body> </html>
上面是html中固定的表格,下面替换id:
var b=[1,2,3,4,5] function a(b){ for(var info=0;info<b.length;info++) { var v= $(".t").html();//将html中的传给变量。 var s=v.replace(/c/,b[info]);//v是字符串,c是表格行的id。 $(".e").append(s); }
虽然是替换tr的id,但是button是属于tr这一行的,所以每一行的id不同按钮的功能也不一样,当然也可以替换button的id。
用script标签的好处是默认不会显示在页面上,而且可以放置处script标签以外所有的标签,而显然模板里一般
不会出现script标签,设置了type后又能保证浏览器不去执行它导致报错。