每天一個JavaScript執行個體-展示設定和擷取CSS樣式設定

來源:互聯網
上載者:User

標籤:pre   gets   doctype   html   return   null   http   htm   ack   

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>每天一個JavaScript執行個體-展示設定和擷取CSS樣式設定</title><style>#date{width:200px;background-color:lime;}</style><script>function getStyle(date,cssprop,cssprop2){//IEif(date.currentStyle){return date.currentStyle[cssprop];}else if(document.defaultView && document.defaultView.getComputedStyle){//console.log(document.defaultView.getComputedStyle(date,null).getPropertyValue(cssprop));return document.defaultView.getComputedStyle(date,null).getPropertyValue(cssprop2);}else{return null;}}window.onload = function(){var date = document.getElementById("date");var color = getStyle(date,"background-color","background-color");console.log(color);date.style.width= "500px";date.style.backgroundColor= "yellow";console.log(date.style.width);console.log(date.style.backgroundColor);//數組標記法date.style["fontFamily"] = "courier";//展示覆蓋屬性var style = date.getAttribute("style");console.log(style);date.setAttribute("style","height:100px");console.log(document.defaultView.getComputedStyle(date,null).getPropertyValue("fontFamily"));//nullconsole.log(document.defaultView.getComputedStyle(date,null).getPropertyValue("font-family"));//STHeitivar style = date.getAttribute("style");//date.style["fontFamily"]="微軟雅黑";var font = getStyle(date,"fontFamily","font-family");//console.log(font);}</script></head><body><div id = "date" style="color:purple">aa</div></body></html>

每天一個JavaScript執行個體-展示設定和擷取CSS樣式設定

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.