为什么从 onclick 事件调用函数时我的输入参数未转义

Why is my input parameter unescaped when calling function from an onclick event

出于某种原因,当调用 js 函数时,从 onclick 事件调用时输入未转义。我不明白为什么。请参阅下面的代码片段进行演示。

当页面加载时以及当您单击输入完全相同但结果不同的按钮时,将调用测试函数。

如果有人能解释这种奇怪的行为,你会让我头疼不已。

function test(val){
document.getElementById('mydiv').innerHTML = val
}

test('text before script <script>do evil stuff here</script> text after script')
<div id = 'mydiv'>
</div>

<button onclick="test('text before script &lt;script&gt;do evil stuff here&lt;/script&gt; text after script')">
try me
</button>

当从属性调用时,您需要双重转义 <:当属性被放入 DOM 时,一次调用处理程序时一次。

例如

<script>

需要转成

&lt;script&gt;

然后进入

&amp;lt;script&amp;gt;

(转义符号)

function test(val){
document.getElementById('mydiv').innerHTML = val
}

test('text before script &lt;script&gt;do evil stuff here&lt;/script&gt; text after script')
<div id = 'mydiv'>
</div>

<button onclick="test('text before script &amp;lt;script&amp;gt;do evil stuff here 2&amp;lt;/script&amp;gt; text after script')">
try me
</button>