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

首頁 > 編程 > JavaScript > 正文

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

2019-11-20 14:05:43
字體:
來源:轉載
供稿:網友

IE6-IE9中tbody的innerHTML不能賦值,重現代碼如下

Js代碼

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>IE6-IE9中tbody的innerHTML不能復制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>

兩個按鈕,第一個獲取tbody的innerHTML,第二個設置tbody的innerHTML。

獲取時所有瀏覽器都彈出了tr的字符串,但設置時IE6-9不支持,而且報錯,如圖

可以利用特性判斷來看瀏覽器是否支持tbody的innerHTML設值

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

點擊下,看看你此時瀏覽本博客的瀏覽器是否支持

Click Me

<script type="text/javascript">// <![CDATA[ var isupportTbodyInnerHTML = function () { var table = document.createElement('table') var tbody = document.createElement('tbody') var tr = document.createElement('tr') var td = document.createElement('td') var txt = document.createTextNode('a') td.appendChild(txt) tr.appendChild(td) tbody.appendChild(tr) table.appendChild(tbody) var boo = true try{ tbody.innerHTML = '<tr><td>b</td></tr>' } catch(e) { boo = false } return boo }(); tbodyInnerHTML.onclick = function() { if (isupportTbodyInnerHTML) { alert('你的瀏覽器支持tbody的innerHTML賦值') } else { alert('你的瀏覽器是IE6-9內核,不支持tbody的innerHTML賦值') } } // ]]></script>

對于IE6-IE9里如果要設置tbody的innerHTML,可以使用如下替代方法

Js代碼

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) }

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

當然還有一個更精簡的版本,它直接采用replaceChild方法替換

Js代碼

function setTBodyInnerHTML(tbody, html) { var div = document.createElement('div') div.innerHTML = '<table>' + html + '</table>' tbody.parentNode.replaceChild(div.firstChild.firstChild, tbody) }
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 兰考县| 定兴县| 武冈市| 九龙县| 固阳县| 思茅市| 会昌县| 红原县| 金沙县| 五家渠市| 城固县| 南城县| 墨竹工卡县| 玉门市| 大足县| 衡水市| 平江县| 神木县| 江油市| 鱼台县| 潮安县| 漳浦县| 凌源市| 容城县| 大姚县| 揭东县| 天镇县| 安岳县| 当涂县| 巴东县| 项城市| 长泰县| 定边县| 甘南县| 安康市| 洛隆县| 桃源县| 绥芬河市| 乐昌市| 竹山县| 公主岭市|