js内联外联样式的获取,父页面获取iframe框架元素返回null

js内联样式,外联样式

获取内联样式

//html部分
<li style = "width:15px;height:50px">
//js部分
var w = document.querySelector('li').style.width//只能获取行内样式
console.log(w);
// 15px

获取外部样式(css文件)

IE不能使用的方法
//html部分
<div>获取外部样式</div>
//css文件
div{
    
    
    width:150px;
    height:150px;
    background-color: pink;
}
//js部分
 var div = document.querySelector('div')
 var div_style = window.getComputedStyle(div)//获取div的style
 var div_w = div_style.width//获取div的宽度
 //150px
 var w = div.style.width
 console.log(w);//此时为''
IE能使用
//js部分
 var cssObj = di'v.currentStyle;
 console.log(cssObj.width);

父页面获取iframe框架元素返回null

原因:

iframe加载需要时间,为加载完成就在js中直接获取对象,则会返回null

解决方法

var i=document.getElementById("footer");//footer为iframe框架 id名
i.onload=function(){
    
    
	var footer_ul=i.contentWindow.document.getElementById("footer_ul")//footer_ul为iframe框架的对象
 }

猜你喜欢

转载自blog.csdn.net/m0_63338686/article/details/125563518
今日推荐