zoukankan      html  css  js  c++  java
  • 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]")

      

    欢迎一起讨论,共同进步
  • 相关阅读:
    BZOJ3098 Hash Killer II 【概率】
    BZOJ4010 [HNOI2015]菜肴制作 【拓扑排序 + 贪心】
    洛谷P4364 [九省联考2018]IIIDX 【线段树】
    洛谷P4363 [九省联考2018]一双木棋chess 【状压dp】
    洛谷P2664 树上游戏 【点分治 + 差分】
    BZOJ1189 [HNOI2007]紧急疏散evacuate 【二分 + 网络流】
    BZOJ1068 [SCOI2007]压缩 【区间dp】
    BZOJ4033 [HAOI2015]树上染色 【树形dp】
    BZOJ4819 [Sdoi2017]新生舞会 【01分数规划 + 费用流】
    排序
  • 原文地址:https://www.cnblogs.com/fengye06050/p/8148684.html
Copyright © 2011-2022 走看看