js--获取和设置css属性
在这一章我们讲述一下如何通过js来操作css中的属性
1,首先,我们想获取元素的一些属性。例如innerHTML,value等值时,我们可以
var object=document.getELementById(id);
var aa=object.innerHTML或者var bb=object.value;
此外对于这些属性的设置,我们也可以直接设置
object.innerHTML="###"
object.value="####"
2,对于width,height,background-color,等等其他的属性我们可以通过以下的方法设置他的值
Object.style.property="###";
有人说,我们可不可以通过var aa=Object.style.property;来获取某个属性值啊?
回答是不可以的,上述方式无法获得属性值。
对于这些属性的获取就很复杂了,我们要考虑浏览器兼容问题(我们在这里封装成一个函数,其中node就是我们要改变属性值的那个元素,property对应是的就是要改变得属性)
function getStyle(node, property){
if (node.style[property]) {
return node.style[property];
}
else if (node.currentStyle) {
return node.currentStyle[property];
}else if (document.defaultView && document.defaultView.getComputedStyle) {
return document.defaultView.getComputedStyle(node, null)[property];
}
return null;
}
js--获取和设置css属性的更多相关文章
- js 获取和设置css3 属性值的实现方法
众多周知 CSS3 增加了很多属性,在读写的时候就没有原先那么方便了. 如:<div style="left:100px"></div> 只考虑行间样式的话 ...
- js原生获取元素的css属性
习惯了用jQuery的css()的方法获取元素的css属性,突然不用jquery了,当要获得元素的css时候,我瞬间停顿了一下,咦?咋获取元素的css值?比如获取元素的width.是这样么?docum ...
- js和jquery设置css样式的几种方法
一.js设置样式的方法 1. 直接设置style的属性 某些情况用这个设置 !important值无效 element.style.height = '50px'; 2. 直接设置属性(只能用于某些 ...
- 如何用javascript获取和设置css3属性
==================获取======================== 我想到的第一个思路 var test = document.getElementById('test'); c ...
- 第二十五篇 jQuery 学习7 获取并设置 CSS 类
jQuery 学习7 获取并设置 CSS 类 jQuery动态控制页面,那么什么是动态呢?我们就说一下静态,静态几乎又纯html+css完成,就是刷新页面之后,不会再出现什么变动,一个实打实的静态 ...
- 关于获取、设置css样式封装的函数入门版
<html> <head> <meta charset="UTF-8"> <title>CSS样式的获取和设置:简单版</ti ...
- 通过设置CSS属性让DIV水平居中
通过设置CSS属性让DIV水平居中 ---------------------- <html> <head> <title></title> <m ...
- Android : 反射机制获取或设置系统属性(SystemProperties)【转】
本文转载自:https://blog.csdn.net/wei_lei/article/details/70312512 Android.os.SystemProperties 提供了获取和设置系统属 ...
- 在jquery中应该使用prop方法来获取和设置checked属性,不应该使用attr。
在jquery中应该使用prop方法来获取和设置checked属性,不应该使用attr. $("#checkAll").prop("checked", true ...
- jquery操作html元素之( 获取并设置 CSS 类)
jQuery 操作 CSS jQuery 拥有若干进行 CSS 操作的方法.我们将学习下面这些: addClass() - 向被选元素添加一个或多个类 removeClass() - 从被选元素删除一 ...
随机推荐
- mapreduce 函数入门 三
一.mapreduce多job串联 1.需求 一个稍复杂点的处理逻辑往往需要多个 mapreduce 程序串联处理,多 job 的串联可以借助 mapreduce 框架的 JobControl 实现 ...
- PostgreSQL 缓存
PostgreSQL physical storage和 inter db 值得阅读 数据在物理介质上存储是以page的形式,大小为8K,如下: a tuple或an item是行的同义词 a ...
- 公众号后台开发(SpingMVC接收与响应公众号消息)
1.准备 1.准备服务 与微信对接的url要具备以下条件: (1)在公网上能够访问 (2)端口只支持80端口 在这里如果是公网能够访问的服务最好,也可以通过花生壳或者其他外网映射工具进行映射,比如ng ...
- 最细的eclipse 安装maven踩过的坑
Eclipse安装maven插件踩过的坑 在线安装maven eclipse安装maven插件,在网上有各种各样的方法,博主使用过的也不止一种,但是留下的印象总是时好时不好,同样的方法也不确定那一次能 ...
- java 简单工具
1.String操作 /** * 根据正则字符串过滤不需要的字符串 * @param arr * @param regex * @return */ public static String[] fi ...
- 百度前端技术学院task14源代码
刚开始理解错误,以为是读取对象,结果后面才发现是二维数组. 另外对于数组排序,创建新的节点啊,输入到doM中啊,都不是很熟悉. <!DOCTYPE html> <html> & ...
- Django CBV和FBV
Django CBV和FBV Django内部CBV内部接收方法操作: 1.通过客户端返回的请求头RequestMethod与RequesrtURL,会以字符串形式发送到服务器端. 2.取到值后通过d ...
- FusionInsight大数据开发学习总结(1)
FusionInsight大数据开发 FusionInsight HD是一个大数据全栈商用平台,支持各种通用大数据应用场景. 技能需求 扎实的编程基础 Java/Scala/python/SQL/sh ...
- tomcat8 url包含|等特殊字符报错400的问题
这个问题纠缠了我很久了,终于在今天早上解决了,感谢自己的不放弃和不断尝试的决心,我坚信,我可以找到解决方式!! 项目用的spring .spring mvc.hibernate框架,关于统一错误页面在 ...
- 安卓、ios时间转换成时间戳的形式
将日期转换成时间戳的形式,在安卓和ios不同的系统下转正会有兼容性的问题 安卓系统下Date.parse(new Date('2018-03-30 12:00:00'))会直接转换成时间戳的形式(简单 ...