浅谈脚本化css(一)
读写css属性
每一个dom元素都有一个属性style,dom.style里面存放的这个元素的行间样式,我们可以通过这个属性来读写元素的行间样式。
注意:
1.我们碰到float这样的关键字属性的时候,前面要加一个css前缀。
float—>cssFloat
2.复合属性必须拆解
border: 1px solid red;
这种属性是不允许出现的,只能写border-width、border-color、border-style。
3.当css中的样式是用“-”连接起来的时候,我们要变成小驼峰式写法。
background-color —> backgroundColor;
这个属性只能读写行间样式,我们写在css的样式是不能获取的,因此我们通过这个属性加样式的时候要注意权重值问题。
同时,我们在js中写样式只能往行间写,永远也写不到css文件里面。
浅谈脚本化css(一)的更多相关文章
- 浅谈脚本化css(二)
查询计算样式 window上面有一个方法叫做getComputedStyle可以来获取元素的计算样式,也就是css样式. window.getComputedStyle(ele. null); J ...
- 浅谈脚本化css(三)之方块运动函数
我们可以写一个让小方块运动的函数: div#demo { width: 100px; ; position: absolute; ; ; } var div = document.getElement ...
- 深入理解脚本化CSS系列第六篇——脚本化伪元素的6种方法
× 目录 [1]动态样式 [2]CSS类[3]setAttribute()[4]CSSRule对象添加[5]空样式覆盖[6]CSSRule对象删除 前面的话 我们可以通过计算样式来读取伪元素的样式信息 ...
- 深入理解脚本化CSS系列第四篇——脚本化样式表
× 目录 [1]CSSStyleSheet [2]CSSRule 前面的话 关于脚本化CSS,查询样式时,查询的是计算样式:设置单个样式时,设置的是行间样式:设置多个样式时,设置的是CSS类名.脚本化 ...
- 深入理解脚本化CSS系列第三篇——脚本化CSS类
前面的话 在实际工作中,我们使用javascript操作CSS样式时,如果要改变大量样式,会使用脚本化CSS类的技术,本文将详细介绍脚本化CSS类 style 我们在改变元素的少部分样式时,一般会直接 ...
- 深入理解脚本化CSS系列第一篇——脚本化行内样式
× 目录 [1]用法 [2]属性 [3]方法 前面的话 脚本化CSS,通俗点说,就是使用javascript来操作CSS.引入CSS有3种方式:外部样式,内部样式和行间样式.本文将主要介绍脚本化行间样 ...
- JavaScript权威指南--脚本化CSS
知识要点 客户端javascript程序员对CSS感兴趣的是因为样式可以通过脚本编程.脚本化css启用了一系列有趣的视觉效果.例如:可以创建动画让文档从右侧“滑入”.创造这些效果的javascript ...
- 关于脚本化css
---恢复内容开始--- 想把自己认为的最重要的,最有用的几块写上,以后会边学边总结完善. 1.首先我们通过JavaScript可以获取到我们想要获取的元素的样式.而这个样式并非单独的哪一个部分的规则 ...
- 深入理解脚本化CSS系列第二篇——查询计算样式
× 目录 [1]getComputedStyle [2]注意事项 [3]currentStyle[4]IE 前面的话 元素的渲染结果是多个CSS样式博弈后的最终结果,这也是CSS中的C(cascade ...
随机推荐
- react.js 点击事件传递参数的方法
<button onClick={this.handleClick.bind(this, props0, props1, ...}></button> handleClick( ...
- ubuntu 16.04 docker下安装klee环境
手动构建docker映象: 从github上获取klee源码 git clone https://github.com/klee/klee.git cd klee 使用存储库根目录中dockerfil ...
- System.Thread.TImer控件——http://www.360doc.com/content/11/0812/11/1039473_139824496.shtml
http://www.360doc.com/content/11/0812/11/1039473_139824496.shtml
- 支付宝小程序自定义弹窗插件|支付宝dialog插件|model插件
支付宝小程序自定义弹窗组件wcPop|小程序自定义对话框|actionSheet弹窗模板 支付宝小程序官方提供的alert提示框.dialog对话框.model弹窗功能比较有限,有些都不能随意自定义修 ...
- Oracle 常见字符操作
一.拼接 1.使用 || 来实现 SELECT '你'||'好!' title FROM dual; 2.使用concat (不支持多个字符串的拼接,但是可以嵌套调用) SELECT concat(' ...
- Tomcat发生java.lang.OutOfMemoryError: PermGen space的解决方案
产生该问题的主要原因是JVM永久带空间不足导致的,可以在环境变量CATALINA_OPTS中提高MaxPermSize参数值 set CATALINA_OPTS = -XX:PermSize=12 ...
- gulp4.0 前端构建脚手架
最近看了下gulp4.0的升级,感觉和3.0相比变化还是比较大的,很多3.0的写法和插件会出现一些莫名其妙的变化,详细的变化就先不说了,这里我直接把我配置好的代码拿过来吧,方便各位可以更好的学习和使用 ...
- 基于flex的不定个数的按钮组
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- centos中软件源码简单的编译安装./configure,make ,make install
参考 Linux下源码编译安装详解 源码编译安装分三个步骤 1. 编译参数配置 2. 编译 3. 安装 1. 源码编译安装环境检查以及编译参数配置 编译器在开始工作之前,需要知道当前的系统环境,比如标 ...
- R语言常用包分类总结
常用包: ——数据处理:lubridata ,plyr ,reshape2,stringr,formatR,mcmc: ——机器学习:nnet,rpart,tree,party,lars,boost, ...