文件命名很重要啊

除了变量命名什么的,文件命名也很重要啊

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <link rel="stylesheet" href="http://static-gwtheme.idkin.com/themes/v1/styles/base.css" />
       <link rel="stylesheet" href="http://static-gwtheme.idkin.com/themes/idu/styles/ad-gallery.css" />

       <style>
           .parentElm{
               position:static;
               width:200px;
               height:200px;                
               border:1px solid red;
               overflow:hidden;
           }
           .childrenElm{
               position:relative;
               width:300px;
               height:180px; 
               border:1px solid black;
               background-color:green;
           }
       </style>
</head>
<body>
<div class="parentElm">
    <div class="childrenElm">        
        <ol>
            <li>position:static 的父元素 overflow 不能遮盖 position 是 absolute 的子元素</li>
            <li>position:fixed 的元素不能被父元素的 overflow 遮盖</li>
            <li>IE6,7: position:static 的父元素 overflow 不能遮盖 position 不是 static 的子元素</li>
        </ol>
    </div>
</div>

<script>
var links = document.getElementsByTagName("link");
var sheets = document.styleSheets;
var cssCollection = {};
var styleCount=0;
var tempUrl,temCss;

for(var i=0;i<links.length;i++){
    tempUrl = links[i].href;
    cssCollection[tempUrl] = {
        fileKey:tempUrl,   
        node:links[i],
        nodeName:links[i].nodeName    
        }
}

for(var i=0;i<sheets.length;i++){
    tempUrl = sheets[i].href||("style_"+(++styleCount));    
    temCss  = cssCollection[tempUrl]||(cssCollection[tempUrl]= {fileKey:tempUrl});  
    temCss.node = temCss.node||sheets[i].ownerNode||sheets[i].owningElement;
    temCss.nodeName = temCss.nodeName||temCss.node.nodeName;
    temCss.sheet = sheets[i];
}

console.log(['links.length = '+links.length,
            'style.length = '+styleCount,
            'sheets.length = '+sheets.length
            ]);
console.log('cssCollection = ',cssCollection);

for(var key in cssCollection){
    if(!cssCollection[key].sheet){
        //why ad-gallery.css fail in firefox 19 ? //我 OOXX ADBLOCK!!!!!!!!
        console.log('============== fail to create styleSheet ================');
        console.log('UA:',window.navigator.userAgent);
        console.log('css : ',cssCollection[key]);
        cssCollection[key].fileKey.match(/^style_\d+$/i) || console.log('fail to load css file: ',cssCollection[key].fileKey);        
    }
}

</script>
</body>
</html>

  

原文地址:https://www.cnblogs.com/ecalf/p/2863558.html