标签：tle test onload classname letter turn body value res
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset="> <title>test suit</title> <script> function assert(value,desc){ var li = document.createElement("li"); li.className = value?"pass":"fail"; li.appendChild(document.createTextNode(desc)); document.getElementById("result").appendChild(li); } window.onload = function(){ var div = document.getElementsByTagName("div")[0]; assert(true,"background-color:" + fetchComputedStyle(div,"background-color")); assert(true,"display:" + fetchComputedStyle(div,"display")); assert(true,"font-size:" + fetchComputedStyle(div,"fontSize")); assert(true,"color:" + fetchComputedStyle(div,"color")); assert(true,"border-top-color:" + fetchComputedStyle(div,"borderTopColor")); assert(true,"border-top-width:" + fetchComputedStyle(div,"border-top-width")); }; function fetchComputedStyle(element,property){ if(window.getComputedStyle){ var computedStyles = window.getComputedStyle(element); // 通过window.getComputedStyle(element)获取一个对象接口，在通过给对象的.getPropertyValue(property)来获取相应的属性。 if(computedStyles){ property = property.replace(/([A-Z])/g,"-$1").toLowerCase(); return computedStyles.getPropertyValue(property); } }else if(element.currentStyle){ property = property.replace(/-([a-z])/ig,function(all,letter){ return letter.toUpperCase(); }); } } </script> <style> #result li.pass {color : green;} #result li.fail {color : red;} </style> <style type = "text/css"> div{ background-color:#ffc; display:inline; font-size:1.8em; border:1px solid crimson; color:green; } </style> </head> <body> <ul id="result"></ul> <div style = "background-color:darkslateblue">$nbsp;</div> <div style="background-color:#369">$nbsp;</div> <div style="background-color:#123456">$nbsp;</div> <div style="background-color:rg6b(44,88,168)">$nbsp;</div> <div style="background-color:rgba(44,88,166,0.5)">$nbsp;</div> <div style="background-color:hsl(120,100%,25%)">$nbsp;</div> <div style="background-color:hsla(120,100%,25%,0.5)">$nbsp;</div> <div style = "color:crimson;" id = "testSubject" title = "Ninja power!"> 忍者Ninja </div> </body> </html>
标签：tle test onload classname letter turn body value res
原文地址：http://www.cnblogs.com/halo-yang/p/7904386.html
