script标签的type="test/html"时
2016-02-15 14:51
549 查看
们可以在<script>片断中定义一个被JS调用的代码,但代码又不在页面上显示,这时,我们可以使用下面的方法:
OK,这个意思是说,当你单击按钮时,可以把commentTemplate的内容追到comment_ul_2里,这很有意思吧,呵呵!
而其中有一个replace,也很有意思,向在替换时,可以接受一个json字符串,然后根据json的key来对比js模块里的key,进行赋值!
真的很有意思!
1 <script id="commentTemplate" type="text/html"> 2 <li> 3 <div class="photo"> 4 <a href="#"> 5 <img src="[UserImg]" /></a></div> 6 <p> 7 <a href="#">[UserName]:</a><span class="time">[CreateDate]</span></p> 8 <div class="clear"> 9 </div> 10 </li> 11 </script>
1 <div id="comment_ul_2"> 2 </div> 3 <input type="button" id="addFun" value="click me" /> 4 <script type="text/javascript"> 5 var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm'); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。 6 $("#addFun").click(function () { 7 var html = document.getElementById("commentTemplate").innerHTML; 8 var source = html.replace(reg, function (node, key) { return { 'UserImg': '1', 'UserName': 'zhang', 'CreateDate': '2011-1-1'}[key]; }); 9 $("#comment_ul_2").append(source); 10 }); 11 12 var zzl = "name:[name]"; 13 zzl = zzl.replace(reg, function (node, key) { return { 'name': '占占'}[key]; }); 14 alert(zzl); 15 16 </script>
OK,这个意思是说,当你单击按钮时,可以把commentTemplate的内容追到comment_ul_2里,这很有意思吧,呵呵!
而其中有一个replace,也很有意思,向在替换时,可以接受一个json字符串,然后根据json的key来对比js模块里的key,进行赋值!
真的很有意思!
相关文章推荐
- HTML网页字体动态显示
- HTML 父元素与子元素之间的margin-top问题
- web前端基础——初识HTML DOM编程
- HTML 属性总结
- DOM创建和删除节点、HTML DOM常用对象[转]
- (3)html一些杂记
- 自定义表单(二)--拖拽(HTML版本)
- HTML语义化
- html资源地址 src="// 开头
- 一次请求执行两次同一html页面
- 了解HTML 盒模型
- html与text区别
- @using (Html.BeginForm())参数示例
- 了解HTML 元素分类
- html页面写完之后,发现下方滚动条可以向右拉动,一拉出现大片空白页面。
- html背景图片定位方法
- 【基础】——HTML VS Web窗体
- HTML <!DOCTYPE> 标签
- HTML制作练习
- HTML——左右側边栏布局