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() - 从被选元素删除一 ...
随机推荐
- 【Activiti学习之七】BPMN子流程、顺序流、流程关口
环境 JDK 1.8 MySQL 5.6 Tomcat 7 Eclipse-Luna activiti 6.0 一.子流程 1.嵌入子流程2.调用子流程3.事件子流程4.事务子流程 二.顺序流1.条件 ...
- 【2019年05月16日】A股最便宜的股票
查看更多A股最便宜的股票:androidinvest.com/CNValueTop/ 经典价值三因子选股: 市盈率PE.市净率PB 和 股息分红率,按照 1:1:1的权重,选择前10大最便宜的股票. ...
- 给电脑提升权限---- 切换为administrator
在装系统的时候我们都会在安装的时候进行创建用户这一操作,安装软件的时候总会出现权限不足的情况, 个人建议:如果你要是比较会使用电脑的话,可以体验一下超级管理员这一角色, 就是安装好了之后,切换为超级管 ...
- Spring Cloud config之三:config-server因为server端和client端的健康检查导致服务超时阻塞问题
springcloud线上一个问题,当config-server连不上git时,微服务集群慢慢的都挂掉. 在入口层增加了日志跟踪问题: org.springframework.cloud.config ...
- FusionInsight大数据开发---Hive应用开发
Hive应用开发 了解Hive的基本架构原理 掌握JDBC客户端开发流程 了解ODBC客户端的开发流程 了解python客户端的开发流程 了解Hcatalog/webHcat开发接口 掌握Hive开发 ...
- thymeleaf是用于编写html模版的编程语言(工具语言)
一.编程语言 用于编写html模版的编程语言. thymeleaf一种命令式和声名式混合的寄生语言. html与thymeleaf的结合是dsl与命令式语言的结合. html与thymeleaf的结合 ...
- C# - Array.Sort()方法
Array类简介 Array类是C#中所有数组的基类.我们常用的[]声明数组即为Array类的语法,我们可通过Array类提供的各种方法对C#中数组进行操作.最典型的就是数组排序 Array.Sort ...
- FindWindow和FindWindowEx函数使用
FindWindow( lpClassName, {窗口的类名} lpWindowName: PChar {窗口的标题} ): HWND; {返回窗口的 ...
- 【转】Apache的架构师们遵循的30条设计原则
本文作者叫Srinath,是一位科学家,软件架构师,也是一名在分布式系统上工作的程序员. 他是Apache Axis2项目的联合创始人,也是Apache Software基金会的成员. 他是WSO2流 ...
- H5+asp.net 微信开发 遇到过的坑
一.微信授权登录 1. 根据code 获取_access_tokens 2. 根据取到的openid和_access_tokens获取用户信息最神奇的是我用我自己的微信账号测试,一开始还可以取到tok ...