示例
gtx.shadowRoot.getElementById("translation")
gtx為host對象
起因
抓去chorome谷歌翻譯插架的內容。有信息的內容div id是"bubble-content"
var contend=document.getElementById("bubble-content")
contend是null ? ! !怎么會是null?我又沒拼錯。
這不科學，然后發現這個div 外層有個#shadow-root (open)
沒見過的東西
事不為常便有妖，問題8成就在這里
查了相關資料后確定
簡而言之shadow-root 包裹下的對象，不在全局的dom樹中，因此getElementById 等方法，獲取不到包裹中的對象。
該功能的目的就是，獨立出一塊渲染塊，不受外層樣式的影響，內層的樣式也不影響外層的顯示。
訪問方式為
1得到shadow-root 外層的根node 這個node是在全局dom樹中的。
var gtx=document.getElementById("gtx-host")
2取得gtx的shadow塊
gtx.shadowRoot
3之后再怎么操作就隨意了
比如取shadow塊中的節點。
var truecontent=gtx.shadowRoot.getElementById("translation");
后來想想，其實以前隱約在哪見到過這功能，但因為一真沒有用，淡忘了