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() - 从被选元素删除一 ...
随机推荐
- ASP.Net Core使用分布式缓存Redis从入门到实战演练
一.课程介绍 人生苦短,我用.NET Core!缓存在很多情况下需要用到,合理利用缓存可以一方面可以提高程序的响应速度,同时可以减少对特定资源访问的压力. 所以经常要用到且不会频繁改变且被用户共享的 ...
- Ognl 语法基础教程
本文将力求用最简单的语言和实例,介绍一下 OGNL 的语法规则,文章主要内容参考自官方文档http://commons.apache.org/proper/commons-ognl/language- ...
- WIndowsServer ---------- 将本地文件映射到服务器
我们在进行在文件中传递文件的时候,对于一些文件比较大的话就很难传递成功,所以可以同过文件映射, 将需要的文件所在的盘符映射到服务器中,在服务其中进行文件传递. 1.找到电脑中的远程桌面,在附件或控制面 ...
- DestroyImmediate和Destroy
DestroyImmediate立即对对像进行销毁并从内存中移除: Destroy销毁场景中的物体,但内存中还存在,当令它需要销毁时,只是给一个标识.而内存中它依然是存在的,只有当内存不够,或一段时间 ...
- docker 的Portainer和Dive
Portainer Portainer是Docker的图形化管理工具,提供状态显示面板.应用模板快速部署.容器镜像网络数据卷的基本操作(包括上传下载镜像,创建容器等操作).事件日志显示.容器控制台操作 ...
- log4net自动删除日志文件
晚上关于删除的日志文件主要有 https://blog.csdn.net/hellolib/article/details/78316253, 其实我这里的实现方式和他差不多,不过我这里不用配置时间, ...
- 移动端可视化框架antv f2出现两个legend选项
前天遇到个坑,把我给坑死了 ,在帮朋友做一个微信公众号的项目,使用的vue全家桶,有个模块需要用到数据可视化展现,之前做项目的时候用过antv,比较熟悉,因为是移动端的项目,所以用的是antv f2这 ...
- C#文件操作之把一个文件复制到另外一个文件夹下
一.文件复制例子如下,具体情况,根据需求扩展. /// <summary> /// /// </summary> /// <param name="srcFol ...
- Java IO---缓冲流和转换流
一. 缓冲流 缓冲流是处理流的一种,也叫高效流,是对4个基本输入输出流的增强,它让输入输出流具有1个缓冲区,能显著减小与外部的IO次数,从而提高读写的效率,并且提供了一些额外的读写方法. 因为 ...
- Django(二)模板
一.模板概念 1.Django通过模板动态生成html 2.模板的加载位置 模板一般建立在templates文件夹中,全局路径的设置在settings.py中 DIRS:决定了整个项目的模板路径的 ...