父、子页面之间页面元素的获取,方法的调用
一、在iframe页面上调取父级页面元素
1.在父页面上获取iframe页面元素(在父页面修改子页面div的背景色为红色)
js代码如下:
1 <script type="text/javascript"> 2 window.onload = function(){ 3 var iframe = document.getElementById('iframeId').contentWindow; //iframeId 为子页面(iframe) id 4 var div =iframe.document.getElementById('objId'); //子页面(iframeId )中指定元素的id
5 div.style.backgroundColor = 'red'; //修改子页面div背景色为红色
6 } 7 </script>
2.在iframe页面上调取父级页面元素
js代码如下:
1 <script type="text/javascript"> 2 window.onload = function(){ 3 var parentiframe = window.parent; //获取父级页面对象 4 var div =parentiframe.document.getElementById('parDiv'); //获取父级页面中指定元素 5 div.style.color = 'red'; 6 } 7 </script>
jq代码如下:
1 <script type="text/javascript"> 2 3 window.onload = function(){ 4 5 var div=$("#parDiv" , parent.document); 6 7 $(div).css("color","red"); 8 9 } 10 11 </script>