Question

我正在尝试向某个<div>添加一段javascript代码。我将代码包含在pre和code标签中，但是当我实际执行此代码时，代码将执行。显然，这根本不是我想要的。

    var code = '<pre><code><script type="text/javascript" src="http://source.com/test.js"><\/script>\n';
    code = code + '<script type="text/javascript">\n';
    code = code + '\tadimp.id = ' + 1 + ';\n';
    code = code + '\tadimp.type = ' + 1 + ';\n';
    code = code + '\tadimp.generate();\n';
    code = code + '<\/script></code></pre>';

    $("#code").html(code);

Answer 1

您应该使用<和>来表示＆lt;和＆gt;在这种情况下。试试这个

var code = '<pre><code>&lt;script type="text/javascript" src="http://source.com/test.js"&gt;&lt;\/script&gt;\n';
    code = code + '&lt;script type="text/javascript"&gt;\n';
    code = code + '\tadimp.id = ' + 1 + ';\n';
    code = code + '\tadimp.type = ' + 1 + ';\n';
    code = code + '\tadimp.generate();\n';
    code = code + '&lt;\/script&gt;</code></pre>';

 $("#code").html(code);

Answer 2

惊喜！您刚刚制作了自己的XSS漏洞。 始终对您放入HTML的任何数据进行HTML编码。（“数据”是您希望在屏幕上显示的任何内容。）

在HTML DOM中，幸运的是，这完全是自动的。只需使用text属性，而不是HTML属性。

var code = [
        '<script type="text/javascript" src="http://source.com/test.js"><\/script>',
        '<script type="text/javascript">',
        '\tadimp.id = ' + 1 + ';',
        '\tadimp.type = ' + 1 + ';',
        '\tadimp.generate();',
        '<\/script>'
    ].join('\n');

$('#code').text(code);
// --------^^^^

现场演示： http://jsfiddle.net/6qdBD/3/

Answer 3

预标记格式化文本不一定保持其中的文本不被执行为html。或者在这种情况下JavaScript。一种更好的方法是替换＆lt;和＆gt;使用html实体<和>。

Answer 4

而不是使用＆lt;和＆gt;符号使用＆amp; lt和＆amp; gt

var code ='＆amp; ltscript type =“text / javascript”src =“http://source.com/test.js”＆amp; gt＆amp; lt / script＆amp; gt \ n'

Answer 5

我建议只需替换< in <script tag to '&lt and at the end to '&gt.

Answer 6

由于在PRE中允许使用HTML标记，因此您不能通过在它们周围拍打<PRE>和</PRE>来将文本文件“插入”到HTML文档中。你必须转换＆amp;，＆lt;和＆gt;首先将字符转换为实体。

来自http://htmlhelp.com/reference/wilbur/block/pre.html

复制到预标签的Javascript代码示例将被执行

6 个答案: