2015-02-09——js笔记
示例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];
}
}
}
}
}
2015-02-09——js笔记的更多相关文章
- 02: vue.js常用指令
目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...
- Data Visualization and D3.js 笔记(1)
课程地址: https://classroom.udacity.com/courses/ud507 什么是数据可视化? 高效传达一个故事/概念,探索数据的pattern 通过颜色.尺寸.形式在视觉上表 ...
- js笔记-0
#js笔记-0 数组: indexOf方法: Array也可以通过indexOf()来搜索一个指定的元素的位置: var arr = [10, 20, '30', 'xyz']; arr.indexO ...
- Node.js 笔记02
一.关于命令 常用命令: dir 列出当前目录下面所有的文件 cd 目录名 进入到指定的目录,. 当前目录, .. 进入上级目录,cd . 当前目录, cd .. 上级目录 md 目录名 创建文件夹 ...
- 2015年10月23日JS笔记
ECMAScript标准:JavaScript核心语法 微软:Jscript ECMAScript标准:一纸空文 JavaScript和JScritp都号称完全实现了 ECMAScript标准 W3C ...
- JS笔记—02
1.String截取:substr:截几位, substring:截到哪. 2.String的操作,例如变大写,小写,本身不会变,只是在栈里交换引用似的 var str = "hello w ...
- iOS 学习笔记 二 (2015.02.26)
How To Use Git Source Control with Xcode in iOS 6 If you're new here, you may want to subscribe to m ...
- iOS 学习笔记 一 (2015.02.05)
一:Xcode6输入框设置为 keyboard type设置为Number Pad弹不出键盘的解决办法 问题:Can't find keyplane that supports type 4 fo ...
- vue.js及项目实战[笔记]— 02 vue.js基础
一. 基础 1. 注册全局组件 应用场景:多出使用的公共性能组件,就可以注册成全局组件,减少冗余代码 全局APIVue.component('组件名','组件对象') 2.附加功能:过滤器&监 ...
- 02 Node.js学习笔记之http服务
在Node中可以非常轻松的构建一个Web服务器,在Node中提供了一个http模块,这个模块主要功能就是帮助你创建一个Web服务器. 创建步骤: //1.加载http模块 var http=requi ...
随机推荐
- React Native : 自定义视图
代码地址如下:http://www.demodashi.com/demo/11686.html 这次我们要做的仿 新闻头条 的首页的顶部标签列表,不要在意新闻内容. 请求数据 首先做顶部的目录视图,首 ...
- IOS下拉放大图片
代码地址如下:http://www.demodashi.com/demo/11623.html 一.实现效果图 现在越来越多的APP中存在下拉放大图片的效果,今天贡献一下我的实现这种方法的原理,和我遇 ...
- select/poll/epoll原理探究及总结
select,poll,epoll都是IO多路复用的机制.I/O多路复用就通过一种机制,可以监视多个描述符,一旦某个描述符就绪(一般是读就绪或者写就绪),能够通知程序进行相应的读写操作.但select ...
- hystrix-turbine实现多服务监控
原文地址:http://www.cnblogs.com/skyblog/p/5633757.html 1. 概述 Demo地址:http://git.oschina.net/zhou666/spr ...
- centos7单机版安装hbase
1.首先安装jdk1.8 yum install java-1.8.0-openjdk* -y 2.下载hbase 地址:http://mirrors.shuosc.org/apache/hbase/ ...
- 由"永恒之蓝"病毒而来的电脑知识科普
永恒之蓝病毒事件: 继英国医院被攻击,随后在刚刚过去的5月12日晚上20点左右肆虐中国高校的WannaCry勒索事件,全国各地的高校学生纷纷反映,自己的电脑遭到病毒的攻击,文档被加密,壁纸遭到篡改,并 ...
- html块级元素与内联元素的区别
1. 块级元素(block element): 概念理解:如果不用css控制,块级元素在文档流中以一行显示,及它所占的宽度为其父级元素所占的宽度,若超过宽度会重新另起一行显示,高度会随着内容高度的增 ...
- osx升级到10.10后,用pod install报错终于解决的方法
先依照这个文章做:http://blog.csdn.net/dqjyong/article/details/37958067 大概过程例如以下: Open Xcode 6 Open Preferenc ...
- css中div标签不置顶
设置div属性垂直对齐方式为:top <div style="vertical-align: top;"></div>
- eclipse 建立maven项目 显示红叉的解决方法
1.建立好之后就会发现项目有红叉. 这时发现查查在main处,打开项目>属性>Java Build Path>source,发现里边有红叉(如下图),这是由于我们的src/main下 ...