2015-02-09——js笔记

2024-08-26 05:25:36

示例1：

　　　增加样式表

　　　示例代码：

function addStylesheet(url, media) {
               var link = document.createElement('link');
               link.setAttribute('rel', 'stylesheet');
               link.setAttribute('type', 'text/css');
               link.setAttribute('meida', media);
               link.setAttribute('href', url);
               document.getElementsByTagName('head')[0].appendChild(link);
           }

示例2：

　　　获取样式表

　　　示例代码：

function getStylesheet(url, media) {
               var sheets = [];
               for (var i = 0; i < document.styleSheets.length; i++) {
                   if (url && document.styleSheets[i].href.indexOf(url) === -1 ) {
                       continue;
                   }
                   if (media) {
                       var sheetMedia;
                       if (document.styleSheets[i].media.mediaText) {
                           sheetMedia = document.styleSheets[i].media.mediaText;
                       } else {
                           sheetMedia = document.styleSheets[i].media;
                       }
                       if (media !== sheetMedia) {
                           continue;
                       }
                   }
                   sheets.push(document.styleSheets[i]);
               }
           }

示例3：

　　　删除样式表

　　　示例代码：

function removeStylesheet(url, media) {
               var sheets = getStylesheet(url, media);
               for (var i = 0; i < sheets.length; i++) {
                   var node = sheets[i].ownerNode || sheets[i].owningElement;
                   sheets[i].disabled = true;
                   node.parentNode.removeChild(node);
               }
           }

示例4：

　　　增加一条CSS规则

　　　示例代码：

function addCssRule(selector, styles, index, url, meida) {
               var declaration = '';
               for (property in styles) {
                   if (!styles.hasOwnProperty(property)) {
                       continue;
                   }
                   declaration += property + ':' + styles[property] + ';';
               }
               var styleSheets = (typeof url === 'array') ? url : getStylesheet(url, media);
               var newIndex;
               for (var i = 0; i　< styleSheets.length; i++) {
                   if (styleSheets[i].insertRule) {//DOM2
                       newIndex = index > 0 ? index : styleSheets[i].cssRules;
                       styleSheets[i].insertRule(selector + '{' + declaration + '}', newIndex);
                   } else if (styleSheets[i].addRule) {//MSIE
                       newIndex = index >= 0 ? index : -1;
                       styleSheets[i].addRule(selector, declaration, newIndex);
                   }
               }
           }

示例5：

　　　编辑一条css规则

　　　示例代码：

function editCssRule(selector, styles, url, media) {
               var styleSheets = (typeof url === 'array') ? url : getStylesheet(url, media);
               for (var i = 0; i < styleSheets.length; i++) {
                   var rules = styleSheets[i].cssRules || styleSheets[i].rules;
                   selector = selector.toUpperCase();
                   for (var j = 0; j < rules.length; j++) {
                       if (rules[j].selectorText.toUpperCase() === selector ) {
                           for (property in styles) {
                               if (!styles.hasOwnProperty(property)) {
                                   continue;
                               }
                               rules[j].style[camelize(property)] = styles[property];
                           }
                       }
                   }
               }
           }

　

最新文章

热门文章