让script的type属性等于text/html

type属性为text/html的时候，<script>片断中定义一个被JS调用的代码，代码不会在页面上显示

复制代码
<script id="commentTemplate" type="text/html">   
    <li>  
        <div class="photo">  
            <a href="#"> <img src="[UserImg]" style="height:50px;" /></a>  
        </div>  
        <p>  
            <a href="#">[UserName]:</a><span class="time">[CreateDate]</span>  
        </p>  
        <div class="clear"></div>  
    </li>  
</script>
复制代码

上面的代码片段的使用

复制代码
<html>  
<head>  
<title>标题</title>  
<meta charset="UTF-8">
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>  
<body>  
    <div id="comment_ul_2"></div>  
    <input type="button" id="addFun" value="click me" />  
    <script type="text/javascript">  
        //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。  
        var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm'); 
        $("#addFun").click(function() {  
            var html = document.getElementById("commentTemplate").innerHTML;  
            var source = html.replace(reg, function(node, key) {  
                return {  
                    'UserImg' : 'https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1459913929&di=1934ccc3709e8e2301e73b578270212a&src=http://p7.qhimg.com/t01e6b39b78a7a65ac0.jpg',  
                    'UserName' : 'ABC',  
                    'CreateDate' : '2011-1-1'  
                }[key];  
            });  
            $("#comment_ul_2").append(source);  
        });   
    </script>  
</body>  
</html>
复制代码

当单击按钮时，可以把commentTemplate的内容追到comment_ul_2里

在替换时，可以接受一个json字符串，然后根据json的key来对比js模块里的key，进行赋值

 

posted @   慕尘  阅读(1822)  评论(0)  编辑  收藏  举报
（评论功能已被禁用）
编辑推荐：
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
阅读排行：
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· Manus爆火，是硬核还是营销？
· 终于写完轮子一部分：tcp代理 了，记录一下
· 【杭电多校比赛记录】2025“钉耙编程”中国大学生算法设计春季联赛（1）
点击右上角即可分享
微信分享提示