首先實現父級通過iframe訪問子級DOM元素有以下幾點需要特別注意的
1,需要在服務器的情況下訪問,可以使用本地服務器
2,需要使用入口函數(當初被這個坑慘了)
3,這種方法跨域訪問不了
*使用本地服務器
首先建立兩個文件分別命名為父級parantN.html和子級Child.html兩個html文件,先看看html文件代碼。
父級parantN.html
<iframe id='myIframe' name="myIrame" src="Child.html"
scrolling="no" border="0" frameborder="no" framespacing="0"
allowfullscreen="true">
</iframe>
</body>
子級Child.html
<div id="qq">
<div>
<div id="text">我是子級</div>
</div>
</div>
使用JS代碼獲取iframe里面的元素
// 使用JavaScript方法獲取
// 例子:window.frames["iframe的name值"].document.getElementById("iframe中控件的ID")
window.onload = function () {
var text = window.frames["myIrame"].document.getElementById("text")
text.style.color = 'red';
text.innerHTML = '看我使用JavaScript方法獲取了iframe里面的元素,並修改了。';
}
||||||||
使用JQ獲取iframe里面的元素
//例子: $("#iframe的ID").contents().find("#iframe中的控件ID")
window.onload = function () {
$("#myIframe").contents().find("#text").html('使用JQ改變了iframe里面的內容').css({
'color': 'red'
})
}