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. ...
随机推荐
- SSO单点登录系列1:cas客户端源码分析cas-client-java-2.1.1.jar
落雨 cas 单点登录 希望能给以后来研究cas的兄弟留下一点思路,也算是研究了两天的成果,外国人的代码写的很晦涩,翻译下来也没有时间继续跟进,所以有错误的还请大家跟帖和我讨论,qq 39426378 ...
- struts2注解总结----@Action和@Result
除了使用配置文件配置之外,还能够使用注解来配置 以下是一些经常使用的注解 介绍: @Action/@Actions: @Action指定一个类为action,相应配置文件里的<action> ...
- Linux系统编程_1_文件夹读取(实现简单ls命令)
闲来无事.随便写写,实现简单的ls命令: | 1 #include <stdio.h> | 2 #include <stdlib.h> | 3 #include <dir ...
- C#遍历指定路径下的目录
通过指定路径訪问路径下的文件.在C#的开发中主要利用了Directory类和DirectoryInfo类,简要介绍Directory类中的成员:命名空间 System.IO 命名空间 1.Create ...
- Android开发第一讲之目录结构和程序的执行流程
1.如何在eclipse当中,修改字体 下面的这种办法,可以更改xml的字体 窗口--首选项--常规--外观--颜色和字体--基本--文本字体--编辑Window --> Preferences ...
- 何为SLAM
名词解释: SLAM (simultaneous localization and mapping),也称为CML (Concurrent Mapping and Localizatio ...
- java GC(Garbage Collector) | System.gc()
http://win.sy.blog.163.com/blog/static/94197186201151093543556/ Java垃圾回收调优
- Objective-C学习笔记（十九）——对象方法和类方法的相互调用
事实上在OC的对象方法(减号方法)和类方法(加号方法)并非相互独立的,它们也能够发生千丝万缕的关系,今天我们来研究下它们两者相互调用的问题.该样例还是以People类为基础. (一)对象方法调用类方法 ...
- webpack3.0 环境搭建
额.备份一下总是好的 #为了避免某些国外镜像源安装失败,先设置淘宝镜像代理 yarn config set registry https://registry.npm.taobao.org # 初始化 ...
- FZU 2124 FOJ 2124 吃豆人【BFS】
Problem 2124 吃豆人 Accept: 134 Submit: 575 Time Limit: 1000 mSec Memory Limit : 32768 KB Probl ...