小編給大家分享一下innerHTML與jquery里html()有哪些區(qū)別，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

成都創(chuàng)新互聯(lián)專注為客戶提供全方位的互聯(lián)網(wǎng)綜合服務(wù)，包含不限于成都做網(wǎng)站、網(wǎng)站制作、資中網(wǎng)絡(luò)推廣、小程序開發(fā)、資中網(wǎng)絡(luò)營銷、資中企業(yè)策劃、資中品牌公關(guān)、搜索引擎seo、人物專訪、企業(yè)宣傳片、企業(yè)代運(yùn)營等，從售前售中售后，我們都將竭誠為您服務(wù)，您的肯定，是我們最大的嘉獎；成都創(chuàng)新互聯(lián)為所有大學(xué)生創(chuàng)業(yè)者提供資中建站搭建服務(wù)，24小時服務(wù)熱線：13518219792，官方網(wǎng)址：www.cdcxhl.com

區(qū)別：1、html()可以設(shè)置tbody、tr這些只讀標(biāo)簽，而innerHTML在低版本IE下不行，不可以賦值，賦值的話就腳本報錯；2、html()設(shè)置的script腳本會執(zhí)行，innerHTML設(shè)置的script腳本不會執(zhí)行。

InnerHtml() 與html( )的區(qū)別

1、html()可以設(shè)置tbody、tr這些只讀標(biāo)簽，而innerHTML在低版本IE下不行

在一個 HTML 文檔中, 我們可以使用 .html() 方法來獲取任意一個元素的內(nèi)容。 如果選擇器匹配多于一個的元素，那么只有第一個匹配元素的 HTML 內(nèi)容會被獲取。

innerHTML 是從對象的起始位置到終止位置的全部內(nèi)容,包括Html標(biāo)簽

我原本一直以為innerHTML和jquery里的html其實(shí)是完全一樣的，jquery是多此一舉了，直到我遇到一次問題

看個示例：

var tbody=document.createElement('tbody');
tbody.innerHTML='IE下tbody的innerHTML是只讀的'; //在IE下報錯，目標(biāo)對象錯誤

現(xiàn)在用jquery的html試試，

$(tbody).html('IE下tbody的innerHTML是只讀的');

發(fā)現(xiàn)IE下用jquery能正確顯示了，沒任何問題。

后來查閱資料才知道：

jQuery的html()做了些容錯處理，原生的Dom API innerHTML有些元素是不支持的，比如table tr等元素，IE下tbody、tr這些的innerHTML都是只讀的，不允許寫入，而在其他瀏覽器下則沒問題。

jquery里是用了try，catch來檢測，如果報錯則在catch里重新調(diào)用this.empty().append(value)，是通過append來添加字符串的。

而IE里有些元素的innerHTML是只讀的：

在IE6,IE7,IE8,IE9里面 col, colGroup, frameSet, html, head, style,table, tBody, tFoot, tHead, title, tr 這幾個的innerHTML屬性是只讀的，不可以賦值，賦值的話就腳本報錯。IE10這些標(biāo)簽的innerHTML改成可寫的了。

既然在IE6-IE9里這些標(biāo)簽的innerHTML屬性是只讀的，那么我們盡量避免對這些標(biāo)簽的innerHTML屬性賦值，比如說對table的innerHTML可以改為對table父元素(假設(shè)是p)的innerHTML屬性賦值。

2、html()設(shè)置的script腳本會執(zhí)行，innerHTML設(shè)置的script腳本不會執(zhí)行。

因?yàn)閖Query 會把強(qiáng)行讓參數(shù)字符串中的script 標(biāo)簽生效（方式是create and replace），而.innerHTML賦值則不會。

$('#app').html('')  // 會彈出警告框
$('#app')[0].innerHTML = '' // 不會彈出警告框
      // ↑使用[0]將jquery對象轉(zhuǎn)為dom對象，只有dom對象才有innerHTML方法，jQuery沒有。

擴(kuò)展資料：

html()函數(shù)的優(yōu)點(diǎn)

看看innerHTML屬性的缺點(diǎn)，就知道jQuery中html()函數(shù)的優(yōu)點(diǎn)了，它是兼容所有瀏覽的，不存在html5標(biāo)簽不支持的問題，不存在href,src屬性被轉(zhuǎn)換的問題，不存在某些標(biāo)簽設(shè)置不了html串的問題，總之就是一句話，用它基本就萬事無憂了，至少功能的實(shí)現(xiàn)上是這樣。

html()函數(shù)的缺點(diǎn)

看來jQuery的html()函數(shù)似乎完美無限了，其實(shí)不然，它的完美只表現(xiàn)它的功能上，它兼容了所有瀏覽器，包括IE。但偏偏也是IE，盡管兼容了，性能并不樂觀，如果使用html()函數(shù)設(shè)置大數(shù)據(jù)量的html串的話，那將是場災(zāi)難。

在IE下，html()函數(shù)的性能到底低到什么程度？電腦的配置為"i5 四核，8G內(nèi)存，IE9"，測試了用html()函數(shù)設(shè)置2000行4列的table，其平均耗時達(dá)到27秒！具體什么原因?qū)е耯tml()在IE下這么慢，個人粗略看過源碼，覺得使用try方式是主要原因之一，有興趣的同學(xué)可以深入研究一下。

以上是“innerHTML與jquery里html()有哪些區(qū)別”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！