【前端-Javascript】JavaScript的type属性等于text/html 例子

最新推荐文章于 2024-03-19 22:59:36 发布

Japathy

最新推荐文章于 2024-03-19 22:59:36 发布

阅读量2k

点赞数

分类专栏：前端文章标签： javascript

原文链接：https://blog.csdn.net/catoop/article/details/40342491?locationNum=10%20fps=1

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

原文地址：JavaScript的type属性等于text/html 例子

在使用javascript标签<script>的时候，其中type最常用的就是text/javascript

其实这个type还有其他用法，下面直接给出例子：

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

<script id="commentTemplate" type="text/html"> 
    <li>
        <div class="photo">
            <a href="#"> <img src="[UserImg]" /></a>
        </div>
        <p>
            <a href="#">[UserName]：</a><span class="time">[CreateDate]</span>
        </p>
        <div class="clear"></div>
    </li>
</script>

再看上面的代码片段，我们在下面的代码中怎么使用，如下：

<html>
<head>
<title>标题</title>
</head>
<body>
    <div id="comment_ul_2"></div>
    <input type="button" id="addFun" value="click me" />
    <script type="text/javascript">
        var reg = new RegExp("\[([^\[\]]*?)\]", 'igm'); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。
        $("#addFun").click(function() {
            var html = document.getElementById("commentTemplate").innerHTML;
            var source = html.replace(reg, function(node, key) {
                return {
                    'UserImg' : '1',
                    'UserName' : '张',
                    'CreateDate' : '2011-1-1'
                }[key];
            });
            $("#comment_ul_2").append(source);
        });
        var zzl = "name:[name]";
        zzl = zzl.replace(reg, function(node, key) {
            return {
                'name' : '小明'
            }[key];
        });
        alert(zzl);
    </script>
</body>
</html>

这里解释一下：其中有一个replace，在替换时，可以接受一个json字符串，然后根据json的key来对比js模块里的key，进行赋值！

Japathy

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
【前端-Javascript】JavaScript的type属性等于text/html 例子

原文地址：JavaScript的type属性等于text/html 例子在使用javascript标签<script>的时候，其中type最常用的就是text/javascript其实这个type还有其他用法，下面直接给出例子：type属性为text/html的时候，<script>片断中定义一个被JS调用的代码，代码不会在页面上显示<scri...
复制链接

扫一扫