来自jQuery的innerHTML和.html()之间的区别

Question

有人能说出jquery .html()函数和innerHTML之间有什么区别吗？

<script type="text/javascript">
$(document).ready(function(){
            $('#test_link').click(function(){

                //$('#div_test_out').html("<div width='250px' height='100px' id='div_test'><script language='javascript'>alert('insider');<\/script>asddsa</div>");
                document.getElementById('div_test_out').innerHTML="<div width='250px' height='100px' id='div_test'><script language='javascript'>alert('insider');<\/script>asddsa</div>";      
            });
});
</script>
<a href="#" id="test_link" >TEST LINK :-)</a><br/><br/>
<div width="100px" height="100px" id="div_test_out"></div>

当我使用第一个选项时,即jQuery,脚本内部运行,并显示警报,但如果我使用第二个选项,使用innerHTML(我虽然是相同的,它们之间没有区别),脚本不起作用; - (

可能是什么原因？

Answer 1

jQuery的.html()方法是一个用于访问和操作innerHTML的多用途函数.当用作setter时,它返回用于链接的jQuery集合.当用作getter时,它返回集合元素内部的标记表示.

当你将它用作setter时 - 将标记写入元素 - jQuery读取标记并从内部提取脚本.然后它以导致其执行的方式将它们分别添加到DOM..html()隐式地导致一些操作(脚本处理为一个),而写入innerHTML只会导致innerHTML发生变化,但对该HTML的处理却很少.

Answer 2

设置innerHTML属性不会执行脚本.

jQuery包含为您执行脚本的特殊代码.