css样式获取及兼容性(原生js)


类选择器兼容性
              getbyclass()类选择器,在IE8及以下均不可用。 // 类选择器的兼容性
               function getbyclass(parentName,Name){ var parentName=document.getElementById(parentName); // 通过标签名通配符选择所有父容器内的元素
              var all=parentName.getElementsByTagName("*"); console.log(all);  // 创建一个新数组用来接收body元素中满足条件的元素集合
              var arr=new Array; for(var i=0;i<all.length;i++){ if (all[i].className==Name){arr.push(all[i]);} } return arr; } // 选择父容器
              id var a=getbyclass("ddd","d"); console.log(a);
CSS行间样式的获取(并非属性)

			var odiv=document.getElementById("div1");
			alert(odiv.style.height);

CSS内部样式及外链样式的获取

			var odiv=document.getElementById("div1");
var a=odiv.currentStyle; // console.log(odiv.style.cssText);
alert(odiv.currentStyle.width);//IE浏览器         var cssodiv=window.getComputedStyle(odiv); alert(cssodiv.width);//主流浏览器 // 兼容IE和主流浏览器: function getcssstyle(obj){ if(window.getComputedStyle){return window.getComputedStyle(obj);}//IE9及以上支持,一下为undified else{return obj.currentStyle;}}//IE浏览器 var odivcss=getcssstyle(odiv); alert(odivcss.width);

css样式设置

			oDiv.style.backgroundColor="";
			oDiv[style][backgroundColor]="";
//			方括号一般用在传参的时候(否则系统会把参数当成属性)比如:
			function(Name,red){document[name][backgroundColor]=red}

css属性选择器


              var li=document.querySelectorAll("li");
              var li=document.querySelector("li");
              var btn=document.querySelector("input[type=button]")

 

  

posted on 2017-12-30 08:26  水墨江山画  阅读(324)  评论(0编辑  收藏  举报

导航