Javascript:在HTML中转义双引号

Question

images[i].title如果它包含双引号,我如何防止下面的HTML破坏？

for (i=0; i<=images.length-1; i++) {
    gallery += '<img width="250" height="250" src="' +  images[i].src + '" title="' + images[i].title + '" />';
}

Answer 1

因为在我看来似乎没有人能得到正确答案:

for (i=0; i<=images.length-1; i++) {
    gallery += '<img width="250" height="250" src="' +  images[i].src +
               '" title="' + images[i].title.replace(/\"/g,'&quot;') + '" />';
}

这将替换所有引号,最后会出现双引号,并且它们以有效的html格式表示.

Answer 2

您可以使用replace()方法来转义双引号:

for (var i = 0; i < images.length; ++i) {
    gallery += '<img width="250" height="250" src="' + images[i].src +
               '" title="' + images[i].title.replace(/\"/g, '\\"') + '" />';
}

编辑:结果将是一个有效的Javascript字符串,但不会作为HTML标记工作,因为HTML解析器不理解反斜杠转义.您必须在图像标题中用单引号替换双引号字符:

for (var i = 0; i < images.length; ++i) {
    gallery += '<img width="250" height="250" src="' + images[i].src +
               '" title="' + images[i].title.replace(/\"/g, "'") + '" />';
}

或者反转标记中的报价类型:

for (var i = 0; i < images.length; ++i) {
    gallery += "<img width='250' height='250' src='" + images[i].src +
               "' title='" + images[i].title + "' />";
}