javascript控制样式表(不常用)
<html>
<head>
<title>Example XHTML page</title>
<link href="css1.css" rel="stylesheet" />
<link href="css2.css" rel="stylesheet" />
<style>
body{ background: #ccc;}
</style>
</head>
<body>
<div id="myDiv" style="background-color:blue;width:10px;height:25px;"></div>
<script>
/**
* 控制样式(行内样式)
*/
var myDiv = document.getElementById("myDiv");
myDiv.style.cssText = "width:100px; height:100px; background-color:green;border:2px solid #f00;";//一次性设置多个样式
myDiv.style.removeProperty("border");//删除样式
//迭代样式
for(var i=0, len=myDiv.style.length; i<len; i++){
var prop = myDiv.style[i];//或者myDiv.style.item(i)
value = myDiv.style.getPropertyValue(prop);
console.log(prop+':'+value);
}
/**
* 操作样式表(CSS):包括页面中style的样式(不常用)
*/
var supportsDOM2StyleSheets = document.implementation.hasFeature("StyleSheets","2.0");
console.log(supportsDOM2StyleSheets);//判断是否支持DOM2级的样式表
var style1 = document.styleSheets[0];//css1.css
var style2 = document.styleSheets[1];//css2.css
var style3 = document.styleSheets[2];//页面中的style样式表
console.log(style1);//获取第一个样式表
console.log(style2);//获取第二个样式表
console.log(style3);//获取第三个样式表
//添加样式规则
style1.insertRule("div { border:1px solid #ff0}",0);//非IE
style1.addRule("div","border:1px solid #ff0",0);//IE
//deleteRule 删除规则 removeRule IE
</script>
</body>
</html>
css1：
div{
width:100px;
height: 100px;
}
css2：
a{
width: 500px;
height: 100px;
}
javascript控制样式表(不常用)的更多相关文章
- JavaScript 客户端JavaScript之样式表操作(DOM API 提供模块之一)
层叠样式 表和动态HTML 层叠样式表(CSS)是指定HTML文档或XML文档的表现的标准. 使用CSS和Javascript,可以创建出各种视觉效果,这些效果可以统称为动态HTML(DH ...
- CSS样式表之常用文本属性
断更了两周了,因为纠结之后在学java啦,但是还是要把学过的前端知识更完 以下的一些文本属性是CSS最常用的属性: [长度单位]:px(像素) [颜色单位]: 十六进制:#ffffff 分别对应红绿蓝 ...
- JavaScript实现样式表的简单切换
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- JavaScript控制阻止表单提交
1.在表单上使用onSubmit方法 <?php $form = ActiveForm::begin([ 'options'=>[ 'class' => 'form-horizont ...
- 美丽的表格样式(使用CSS样式表控制表格样式)
按照WEB2.0风格,设计了几个表格样式,希望大家喜欢. WEB2.0提倡使用div开布局,但不是要全然放弃使用表格,表格在数据展现方面还是不错的选择. 如今使用介绍使用CSS样式表来控制.美化表格的 ...
- 漂亮的表格样式(使用CSS样式表控制表格样式)
根据WEB2.0风格,设计了几个表格样式,我希望你喜欢. WEB2.0推广使用div开放式布局.但并不是完全放弃使用形式,在数据表现形式而言是一个不错的选择. 本节将介绍如何使用现在CSS样式表来控制 ...
- 漂亮的表格样式–>使用CSS样式表控制表格样式
依照WEB2.0风格,设计了几个表格样式,希望大家喜欢.WEB2.0提倡使用div开布局,但不是要完全放弃使用表格,表格在数据展现方面还是不错的选择.现在介绍使用CSS样式表来控制.美化表格的方法. ...
- Qt样式表之二：QSS语法及常用样式
一.简述 Qt样式表(以下统称QSS)的术语和语法规则几乎和CSS相同.如果你熟悉CSS,可以快速浏览以下内容.不熟悉的话可以先去W3School - CSS或者本人的CSS博客随笔简单了解一下. 在 ...
- JS 控制CSS样式表
JS控制CSS所使用的方法: <style> .rule{ display: none; } </style> 你想要改变把他的display属性由none改为inline. ...
随机推荐
- 手动脱Mole Box壳实战总结
作者:Fly2015 这个程序是吾爱破解脱壳练习第8期的加壳程序,该程序的壳是MoleBox V2.6.5壳,这些都是广告,能够直接无视了.前面的博客手动脱Mole Box V2.6.5壳实战中已经给 ...
- GUID概念
GUID概念 GUID: 即Globally Unique Identifier(全球唯一标识符) 也称作 UUID(Universally Unique IDentifier) . GUID是 ...
- 利用AFNetworking框架去管理从聚合数据上面请求到的数据
数据从JSON文档中读取处理的过程称为“解码”过程,即解析和读取过程,来看一下如果利用AFNetworking框架去管理从聚合数据上面请求到的数据. 一.下载并导入AFNetworking框架 这部分 ...
- 编程算法 - 两个链表的第一个公共结点 代码(C)
两个链表的第一个公共结点 代码(C) 本文地址: http://blog.csdn.net/caroline_wendy 题目: 输入两个链表, 找出它们的第一个公共结点. 计算链表的长度, 然后移动 ...
- 【Python】向函数传递任意数量的实参
传递任意数量的实参 有时候,你预先不知道函数需要接受多少个实参,好在Python允许函数从调用语句中收集任意数量的实参 def get_letter(*letters): for i in lette ...
- java 中 instanceof 和 isInstance区别
两者的功能是等价的.区别: 1.instanceof 是一个操作符(类似new, ==等): 使用方法: if (ins instanceof String) { //logic } 2.isInst ...
- DevOps企业实践与架构
原文地址:http://www.sohu.com/a/112351816_355140 什么是DevOps及其误区 DevOps概念从2009年提出已有8个年头.可是在8年前的那个时候,为什么DevO ...
- VueJS自定义全局和局部指令
除了默认设置的核心指令( v-model 和 v-show ), Vue 也允许注册自定义指令. 使用directive自定义全局指令 下面我们注册一个全局指令 v-focus, 该指令的功能是在页面 ...
- [水]ZOJ1201
给原排列 求 其前面有多少个数比他大. 给每一个数1...2..n前面有多少个数比他大,求原序列 第一个直接统计 第二个从1開始找出第inv[i]+1个空位置放进去就好 printf里的format ...
- js的常用小技巧
//类对象转成数组 var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*")); ...