zoukankan html css js c++ java

取制定元素的最终样式

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>test</title>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
    <div class="head">我的天空</div>
    <div>
    <table class="table">
        <tr>
            <td>
                我的天空
            </td>
            <td>
                我的天空
            </td>
            <td>
                我的天空
            </td>
            <td>
                我的天空
            </td>
            <td>
                我的天空
            </td>
            <td>
                我的天空
            </td>
        </tr>
    </table>
</div>
    
</body>
</html>

<script>

function Toword(obj,arr){
    this.obj=obj;
    this.arr=arr;
    this.init(this.obj,this.arr);
}

Toword.prototype.getcss=function(obj,attr){
    return obj.currentStyle||getComputedStyle(obj,false)[attr];
}
Toword.prototype.init=function(){
    if(this.obj.length){
        for (var j = 0; j < this.obj.length; j++) {
            for (var i = 0; i < this.arr.length; i++) {
                this.obj[j].style[this.arr[i]]=this.getcss(this.obj[j],this.arr[i]);
            }
        }
    }else{
            for (var i = 0; i < this.arr.length; i++) {
                this.obj.style[this.arr[i]]=this.getcss(this.obj,this.arr[i]);
            }
    }
}

var oDiv=document.querySelector(".head");
var aTd=document.querySelectorAll("td");
var oTable=document.querySelector("table");
new Toword(oTable,["width","borderCollapse"])
new Toword(oDiv,["fontSize","backgroundColor","borderLeftWidth","borderLeftColor","borderLeftStyle","borderRightWidth","borderRightColor","borderRightStyle","borderBottomWidth","borderBottomColor","borderBottomStyle","borderTopWidth","borderTopColor","borderTopStyle"])
new Toword(aTd,["fontSize","borderLeftWidth","borderLeftColor","borderLeftStyle","borderRightWidth","borderRightColor","borderRightStyle","borderBottomWidth","borderBottomColor","borderBottomStyle","borderTopWidth","borderTopColor","borderTopStyle","lineHeight","paddingLeft","paddingRight","paddingBottom","paddingTop"])

    
</script>

查看全文

相关阅读:
我与计算机
 C高级第四次作业
 C高级第三次作业
 C高级第二次作业
 C高级第一次PTA作业要求三
 C高级第一次PTA作业
 第0次作业
 # 20182304 实验七《数据结构与面向对象程序设计》实验报告
 # 20182304 实验八《数据结构与面向对象程序设计》实验报告
 # 20182304 《数据结构与面向对象程序设计》第八周学习总结

原文地址：https://www.cnblogs.com/busicu/p/4274011.html