国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁(yè) > 編程 > JavaScript > 正文

IE6-IE9中tbody的innerHTML不能賦值的解決方法

2019-11-20 14:51:24
字體:
來(lái)源:轉(zhuǎn)載
供稿:網(wǎng)友
IE6-IE9中tbody的innerHTML不能賦值,重現(xiàn)代碼如下
復(fù)制代碼 代碼如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>IE6-IE9中tbody的innerHTML不能復(fù)制bug</title>
</head>
<body style="height:3000px">
<table>
<tbody>
<tr><td>aaa</td></tr>
</tbody>
</table>
<p>
<button id="btn1">GET</button><button id="btn2">SET</button>
</p>
<script>
var tbody = document.getElementsByTagName('tbody')[0]
function setTbody() {
tbody.innerHTML = '<tr><td>bbb</td></tr>'
}
function getTbody() {
alert(tbody.innerHTML)
}
btn1.onclick = function() {
getTbody()
}
btn2.onclick = function() {
setTbody()
}
</script>
</body>
</html>

兩個(gè)按鈕,第一個(gè)獲取tbody的innerHTML,第二個(gè)設(shè)置tbody的innerHTML。

獲取時(shí)所有瀏覽器都彈出了tr的字符串,但設(shè)置時(shí)IE6-9不支持,而且報(bào)錯(cuò),如圖
 
可以利用特性判斷來(lái)看瀏覽器是否支持tbody的innerHTML設(shè)值
復(fù)制代碼 代碼如下:

var isupportTbodyInnerHTML = function () {
var table = document.createElement('table')
var tbody = document.createElement('tbody')
table.appendChild(tbody)
var boo = true
try{
tbody.innerHTML = '<tr></tr>'
} catch(e) {
boo = false
}
return boo
}()
alert(isupportTbodyInnerHTML)

對(duì)于IE6-IE9里如果要設(shè)置tbody的innerHTML,可以使用如下替代方法
復(fù)制代碼 代碼如下:

function setTBodyInnerHTML(tbody, html) {
var div = document.createElement('div')
div.innerHTML = '<table>' + html + '</table>'
while(tbody.firstChild) {
tbody.removeChild(tbody.firstChild)
}
tbody.appendChild(div.firstChild.firstChild)
}

用一個(gè)div來(lái)包含一個(gè)table,然后刪除tbody里的所有元素,最后給tbody添加div的第一個(gè)元素的第一個(gè)元素,即div>table>tr。

當(dāng)然還有一個(gè)更精簡(jiǎn)的版本,它直接采用replaceChild方法替換
復(fù)制代碼 代碼如下:

function setTBodyInnerHTML(tbody, html) {
var div = document.createElement('div')
div.innerHTML = '<table>' + html + '</table>'
tbody.parentNode.replaceChild(div.firstChild.firstChild, tbody)
}

從MSDN上記錄上看 col、colGroup、frameset、html、head、style、table、tfoot、tHead、title和tr的innerHTML都是只讀的(IE6-IE9)。

The innerHTML property is read-only on the col, colGroup, frameSet, html, head, style, table, tBody, tFoot, tHead, title, and tr objects.

You can change the value of the title element using the document.title property.

To change the contents of the table, tFoot, tHead, and tr elements, use the table object model described in Building Tables Dynamically. However, to change the content of a particular cell, you can use innerHTML.
發(fā)表評(píng)論 共有條評(píng)論
用戶名: 密碼:
驗(yàn)證碼: 匿名發(fā)表
主站蜘蛛池模板: 宁安市| 吴川市| 佛坪县| 大方县| 无锡市| 孟津县| 阿拉善左旗| 叙永县| 平罗县| 阳信县| 新民市| 静海县| 怀来县| 莱州市| 桐柏县| 宾阳县| 双柏县| 阿克苏市| 通辽市| 陈巴尔虎旗| 凤庆县| 米泉市| 邛崃市| 开化县| 永靖县| 虹口区| 双桥区| 柞水县| 慈溪市| 汨罗市| 个旧市| 曲松县| 原阳县| 攀枝花市| 衡水市| 唐河县| 保康县| 天气| 陇西县| 沂水县| 秦安县|