读写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(一)的更多相关文章

  1. 浅谈脚本化css(二)

    查询计算样式 window上面有一个方法叫做getComputedStyle可以来获取元素的计算样式,也就是css样式.   window.getComputedStyle(ele. null); J ...

  2. 浅谈脚本化css(三)之方块运动函数

    我们可以写一个让小方块运动的函数: div#demo { width: 100px; ; position: absolute; ; ; } var div = document.getElement ...

  3. 深入理解脚本化CSS系列第六篇——脚本化伪元素的6种方法

    × 目录 [1]动态样式 [2]CSS类[3]setAttribute()[4]CSSRule对象添加[5]空样式覆盖[6]CSSRule对象删除 前面的话 我们可以通过计算样式来读取伪元素的样式信息 ...

  4. 深入理解脚本化CSS系列第四篇——脚本化样式表

    × 目录 [1]CSSStyleSheet [2]CSSRule 前面的话 关于脚本化CSS,查询样式时,查询的是计算样式:设置单个样式时,设置的是行间样式:设置多个样式时,设置的是CSS类名.脚本化 ...

  5. 深入理解脚本化CSS系列第三篇——脚本化CSS类

    前面的话 在实际工作中,我们使用javascript操作CSS样式时,如果要改变大量样式,会使用脚本化CSS类的技术,本文将详细介绍脚本化CSS类 style 我们在改变元素的少部分样式时,一般会直接 ...

  6. 深入理解脚本化CSS系列第一篇——脚本化行内样式

    × 目录 [1]用法 [2]属性 [3]方法 前面的话 脚本化CSS,通俗点说,就是使用javascript来操作CSS.引入CSS有3种方式:外部样式,内部样式和行间样式.本文将主要介绍脚本化行间样 ...

  7. JavaScript权威指南--脚本化CSS

    知识要点 客户端javascript程序员对CSS感兴趣的是因为样式可以通过脚本编程.脚本化css启用了一系列有趣的视觉效果.例如:可以创建动画让文档从右侧“滑入”.创造这些效果的javascript ...

  8. 关于脚本化css

    ---恢复内容开始--- 想把自己认为的最重要的,最有用的几块写上,以后会边学边总结完善. 1.首先我们通过JavaScript可以获取到我们想要获取的元素的样式.而这个样式并非单独的哪一个部分的规则 ...

  9. 深入理解脚本化CSS系列第二篇——查询计算样式

    × 目录 [1]getComputedStyle [2]注意事项 [3]currentStyle[4]IE 前面的话 元素的渲染结果是多个CSS样式博弈后的最终结果,这也是CSS中的C(cascade ...

随机推荐

  1. 程序猿的日常——SpringMVC系统架构与流程回顾

    web开发经历了很漫长的时间,在国内也快有十几年的时间了.从最开始的进程级到现在的MVC经历了很多的改进和优化,本篇就主要复习了解下Spring MVC相关的知识. 发展历程 第一阶段 CGI进程响应 ...

  2. git忽略掉文件权限检查

    有时 git diff 执行显示文件内容没变化,但是有 old mode xxx new mode,原因是文件的权限,被chmod变化了,这种变化也被 diff 识别出来了,让git忽略掉文件权限检查 ...

  3. dataTable 参数说明

    下面是一些常用的参数列表,比较常用或者有价值的标示为绿色. 功能参数(Features) 参数名 说明 参考值 默认值 autoWidth 定义是否由控件自动控制列宽 Boolean true def ...

  4. 【bzoj2789】 Letters 树状数组

    又是一道树状数组求逆序对的题目. 这一题我们可以将第二个串中的每一个字母,与第一个串中的字母做两两匹配,令第二个串第i个字母的值id[i]为该字母与第一个串中的字母匹配到的位置. 然后考虑到所求答案为 ...

  5. Visual Studio和eclipse的大小写转换快捷键

    Visual Studio: 转小写:ctrl + u 转大写:  ctrl + shift + u eclipse: 转小写:  ctrl + shift + y 转大写:  ctrl + shif ...

  6. 【jQuery源码】tokenize方法

    //得到由选择器生成的token对象的数组(下面的groups) //Sizzle的Token格式如下 :{value:'匹配到的字符串', type:'对应的Token类型', matches:'正 ...

  7. 《LeetBook》leetcode题解(18) : 4Sum[M]

    我现在在做一个叫<leetbook>的免费开源书项目,力求提供最易懂的中文思路,目前把解题思路都同步更新到gitbook上了,需要的同学可以去看看 书的地址:https://hk029.g ...

  8. Android 开发工具类 23_getImage

    pathText = "http://192.168.1.100:8080/ServerForPicture/wangjialin.jpg" import java.io.Inpu ...

  9. 《垃圾回收的算法与实现》——保守式GC

    保守式GC 保守式GC指"不能识别指针和非指针的GC". 不明确的根,寄存器.调用栈.全局变量空间等属于GC root,这些GC均不能识别出是指针还是非指针. 指针的识别,在不明确 ...

  10. R语言之数据处理常用包

    dplyr包是Hadley Wickham的新作,主要用于数据清洗和整理,该包专注dataframe数据格式,从而大幅提高了数据处理速度,并且提供了与其它数据库的接口:tidyr包的作者是Hadley ...