字符串在附加时被解释为HTML标记

String being interpreted as an HTML tag when appending it

本文关键字：解释 HTML 标记 字符串      更新时间：2023-09-26

我正在解析一个JSON对象，并将数据显示到一个表中。然而，其中一些数据有括号，如<，>，>=<=后面跟一个字母或数字。在这种情况下，来自JSOn的数据如下所示：

    (rRandomString<iamNotaTAG)

附加后得到的html是这样的：

    (rRandomString
    <iamNotaTAG) td="" <=""></<iamNotaTAG)>

更新1:我用来解析JSON的代码是这个

    var json = $.parseJSON(data);
    for (var i = 0, maxlength = json.length; i < maxlength; i += 1 ) {
       my_string = json[i][1];
       result += "<tr class='my_result'>"
              + "<td>"+my_string+"</td></tr>"
    }
    $('#my_table tbody').html(result);

您真正应该做的是将内容添加为文本而不是HTML。这对您来说有点棘手，因为您要附加一个HTML结构。因此，它需要重新思考：

var result = $([]); // empty object
var json = $.parseJSON(data);
for (var i = 0, maxlength = json.length; i < maxlength; i += 1 ) {
   var my_string = json[i][1]; // this should really be locally defined, I think
   var newcontent = $('<td>')      // create a td element
       .text(my_string)            // add the content as text
       .wrap('<tr>')               // wrap the td in a new tr
       .parent()                   // go up to the tr
           .addClass('my_result'); // add the class to the tr
   result.add(newcontent);         // add the tr to the set of trs
}
$('#my_table tbody').html(result); // add all the trs to the tbody

在将字符串添加到结果html之前，只需对其进行转义(http://jsfiddle.net/cvAuB/)

var json = [[0, "some str"], [1, "some <str>"], [0, "some str &&& <a>not a link</a>"]], },           result = "", current;

var tagsToReplace = {
    '&': '&amp;',
    '<': '&lt;',
    '>': '&gt;'
}
function replaceTag(tag) {
    return tagsToReplace[tag] || tag;
}
function textify(str) {
    return str.replace(/[&<>]/g, replaceTag);
};
for (var i = 0, maxlength = json.length; i < maxlength; i++ ) {
   current = textify(json[i][1]);
   result += "<tr class='my_result'>"
          + "<td>"+current+"</td></tr>"
}
$('#my_table tbody').html(result);
相关文章：