在某个项目中,我们经常会需要来获取某个元素的样式,比如说获取一个div的color;这样,新的问出现了,

var style = box.style.width;console.log(style);如果我们写的是行内的样式,可以轻松通过这种方式来获得所需要的样式,不过,如果我们的样式是内联或者外联样式,就取不到了;

 

<script type="text/javascript">
window.onload=function(){
//获取行间样式
var oDiv=document.getElementById("Div");
alert(oDiv.style.background);

//获取非行间样式 方法,currentStyle是IE中的属性,getComputedStyle是其他浏览器的方法(注意其有两个参数);在非行间样式中,style属性只能去赋值,在行间样式中才能去获取样式;
function getStyle(obj, attr)
{
if(obj.currentStyle)
{
return obj.currentStyle[attr];
}
else
{
return window.getComputedStyle(obj,false)[attr];
}
}
alert(getStyle(oDiv2,"background")) ;
}

</script>

 

js如何获取样式?的更多相关文章

  1. JS之获取样式

    基本代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  2. js中获取样式的俩种方法 style.color和style['color'] 区别

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. js中获取css的样式

    因为给定一个div宽度或者其他样式之后,再设置一个border的宽度在js中得到的obj.setoffWidth就会变成width加上border的二倍宽度,因此可以自己写一个方法来获取样式.(obj ...

  4. 原生js获取样式

    js中的获取样式是在是让人头疼,为了方便兼容多个浏览器,把设置样式封装成一个函数. 函数如下: function getStyle(element, property) { var value = e ...

  5. js中获取css样式属性值

    关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...

  6. 为什么我获取不到这个css样式?js原生获取css样式总结

    还是自己遇到的一个坑的总结吧!与其说是坑不如说自己学艺不精,让我先哭一会!! 需求 简单就是获取一个css的height (好吧 就是一个这么简单的需求) 实践 好吧 长时间的JQ 我已经对原生无能了 ...

  7. JS获取样式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. style设置/获取样式的问题 和 offsetWidth/offsetHeight的问题

    style设置/获取样式的问题:1.js通过style方法    --加样式:加的是行间样式 oDiv.style.width="20"+'px';    --取样式:取得是行间样 ...

  9. js中获取css属性

    直接获取 window.onload = function() { var but = document.getElementById('button'); var div = document.ge ...

随机推荐

  1. 【 js 基础 】作用域和闭包

    一.编译过程 常见编译性语言,在程序代码执行之前会经历三个步骤,称为编译. 步骤一:分词或者词法分析 将由字符组成的字符串分解成有意义的代码块,这些代码块被称为词法单元. 例子:  var a = 2 ...

  2. Vue 非父子组件通信

    组件是Vue核心的一块内容,组件之间的通信也是很基本的开发需求.组件通信又包括父组件向子组件传数据,子组件向父组件传数据,非父子组件间的通信.前两种通信Vue的文档都说的很清楚,但是第三种文档上确只有 ...

  3. nmon用法

    一.简介 nmon是一个简单的性能监测工具,可以监测CPU.内存.网络等的使用情况.它是一个系统监视.调优.性能测试工具,它能一次性提供大量性能相关的信息. 二.安装与执行 下载地址:http://n ...

  4. React Native 仿天猫物流跟踪时间轴

    最近心血来潮开始学习ReactNative,正好最近有一个项目可能会用到时间轴,页面原型类似于天猫的物流跟踪,如下图 分析之后决定使用ListView来实现,左边的时间轴则使用Art来绘制. 分析左边 ...

  5. 浅谈js中的正则表达式

    很多时候多会被正则表达式搞的晕头转向,最近抽出时间对正则表达式进行了系统的学习,整理如下: 正则表达式的创建 两种方法,一种是直接写,由包含在斜杠之间的模式组成:另一种是调用RegExp对象的构造函数 ...

  6. 使用CoApp创建NuGet C++静态库包

    NuGet是微软开发平台下的包管理软件,使用它你可以非常方便的将一些第三方的库.框架整合进自己的项目中,省去了不少麻烦的配置过程.但是从官方文档上来看,貌似NuGet对C++的支持不是很好,并且在现阶 ...

  7. Hadoop 笔记1 (原理和HDFS分布式搭建)

    1. hadoop 是什么 以及解决的问题 (自行百度) 2.基本概念的讲解 1. NodeName  master 节点(NN) 主节点 保存了metaData(元数据信息) 包括文件的owener ...

  8. git视频教程

    git 精简版视频教程-2小时快速入门精华版,小教程很快就可以看完. 旺旺 QQ:Git是目前世界上最先进的分布式版本控制系统(没有之一). Git有非常高的逼格,简单来说就是:高端大气上档次. 这么 ...

  9. Transparent Application Failover 透明应用切换

    官方文档地址 http://docs.oracle.com/cd/E11882_01/network.112/e41945/advcfg.htm#NETAG455 About Transparent ...

  10. hibernate查询部分字段转换成实体bean

    //hibernate查询部分字段转换成实体bean /** * 查询线路信息 */ @Override public List<Line> getSimpleLineListByTj(M ...