代码之家  ›  专栏  ›  技术社区  ›  noah

jQuery:在不执行脚本的情况下解析/操作HTML

  •  4
  • noah  · 技术社区  · 17 年前

    我正在通过Ajax以以下格式加载一些HTML:

    <div id="div1">
      ... some content ...
    </div>
    <div id="div2">
      ...some content...
    </div>
    ... etc.
    

    我需要迭代响应中的每个div并分别处理它。为映射到id的每个div的HTML内容提供一个单独的字符串可以满足我的要求。但是,div可能包含脚本标记,我需要保留这些标记,但不需要执行它们(稍后当我将HTML粘贴到文档中时,它们将执行,因此在解析过程中执行这些标记是不好的)。我的第一个想法是这样做:

    // data being the result from $.get
    var clean = data.replace(/<script.*?</script>/,function() {
        // insert some unique token, save the tag, put it back while I'm processing
    }); 
    
    $('<div/>').html(clean).children().each( /* ... process here ... */);
    

    <script> var foo = '</script>'; // ... </script>
    

    这会把事情搞砸的。更不用说,整个事情从一开始就感觉像是一个黑客。有人知道更好的方法吗?

    编辑:以下是我提出的解决方案:

    var divSplitRegex = /(?:^|<\/div>)\s*<div\s+id="prefix-(.+?)">/g,
        idReplacement = preDelimeter+'$1'+postDelimeter;
    var r = data.replace(<\/div>\s*$/,'').
        replace(divSplitRegex,idReplacement).split(preDelimeter);
    $.each(r,function() {
        var content;
        if(this) {
            callback.apply(null,this.split(postDelimeter));
        }
    });
    

    所以,我还是不喜欢这个解决方案。谁有更好的?

    3 回复  |  直到 17 年前
        1
  •  3
  •   cgp    17 年前

    仅供参考,在任何JavaScript脚本中使用unescaped都会导致浏览器出现此问题。开发人员无论如何都要逃避,所以没有借口。所以你可以“相信”在任何情况下都会破裂。

    <body>
     <div>
       <script>
         alert('<script> tags </script> are not '+
             'valid in regular old HTML without being escaped.');
       </script>
    </body>
    

    http://jsbin.com/itevu

        2
  •  2
  •   Shannon    15 年前

    在某些情况下,删除脚本标记会导致无效的html:

     <html>
        <head>
        </head>
        <body>
            <p>This should be
            <script type="text/javascript">
                document.writeln("<b");
            </script>>bolded</b>.
        </body>
     </html>