xxx为属性. 
ele为元素.

1.style.是针对于样式

在前面的一篇博客中我也有说到,ele.style.xxx; 通常用于赋值,赋值也是针对于行内样式,用它来取值的话,它只能取到内联样式.
今天有另外发现,ele.style.display可以被获取到!–2016.11.10

2.currentStyle是针对于样式

这是ie用来获取样式的方法,通常这样使用:ele.currentStyle.xxx;可以获取内联和外联样式

3.getComputedStyle是针对于样式

除了ie貌似都支持,使用方法:getComputedStyle(ele,false)[xxx];这里出现false的原因是getComputedStyle可以获取伪元素,如果想获取伪元素的 话,将false替换掉即可以获取内联和外联样式

4.getAttribute 针对于属性

ele.getAttribute() 只能获取元素中的内联属性,并且可以获得自定义的属性.

用JS获取Html标签属性有两种方法:

如<a id="link" href="www.baidu.com" title="测试" blogname="前端开发">Web开发</a>

JS代码:

var ka=document.getElementByI d("link");
alert(ka.getAttribute("id"));
alert(ka.id);

两种方法都能弹出a标签的ID属性,但从各浏览器兼容上来说用ka.id的方式更好,但对于自定义属性blogname,则就要用getAttribute()来实现了,如:

alert(ka.getAttribute("blogname")); //前端开发

5.setAttribue针对于属性

赋值也是针对于行内属性,

浅谈style.,currentStyle,getComputedStyle,getAttribute的更多相关文章

  1. 用JS查看修改CSS样式(cssText,attribute('style'),currentStyle,getComputedStyle)

    CSS样式定义方法 大家都知道,在为HTML设置样式的时候,通常有三种方法:内联样式,内部样式表,外部样式表. 1.内联样式: 内联样式表就是在HTML元素中的行内直接添加style属性. <d ...

  2. style currentStyle getComputedStyle的区别和用法

    先介绍下层叠样式表的三种形式: 1.内联样式,在html标签中style属性设置. <p style="color:#f90">内联样式</p> 2.嵌入样 ...

  3. 元素高度、宽度获取 style currentStyle getComputedStyle getBoundingClientRect

    1.示例代码 (1)html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  4. 浅谈style.height、clientHeight、offsetHeight、scrollHeight

    先分别介绍以下,以下资料来自MDN HTMLElement.offsetHeight 是一个只读属性,它返回该元素的像素高度,高度包含该元素的垂直内边距和边框,且是一个整数. Element.clie ...

  5. CSSOM之getComputedStyle,currentStyle,getPropertyValue,getAttribute

    js关于CSSOM编程的样式相关几个常用的方法 webkit:getComputedStyle,getPropertyValue IE:currentStyle,getAttribute 前言 jqu ...

  6. 前端性能优化--为什么DOM操作慢? 浅谈DOM的操作以及性能优化问题-重绘重排 为什么要减少DOM操作 为什么要减少操作DOM

    前端性能优化--为什么DOM操作慢?   作为一个前端,不能不考虑性能问题.对于大多数前端来说,性能优化的方法可能包括以下这些: 减少HTTP请求(合并css.js,雪碧图/base64图片) 压缩( ...

  7. Js之浅谈dom操作

    JavaScript之浅谈dom操作 1.理解dom: DOM(Document Object Model ,文档对象模型)一种独立于语言,用于操作xml,html文档的应用编程接口. 怎么说,我从两 ...

  8. 浅谈Hybrid技术的设计与实现第二弹

    前言 浅谈Hybrid技术的设计与实现 浅谈Hybrid技术的设计与实现第二弹 浅谈Hybrid技术的设计与实现第三弹——落地篇 接上文:浅谈Hybrid技术的设计与实现(阅读本文前,建议阅读这个先) ...

  9. 浅谈Hybrid技术的设计与实现

    前言 浅谈Hybrid技术的设计与实现 浅谈Hybrid技术的设计与实现第二弹 浅谈Hybrid技术的设计与实现第三弹——落地篇 随着移动浪潮的兴起,各种APP层出不穷,极速的业务扩展提升了团队对开发 ...

随机推荐

  1. 洛谷 P1272 重建道路 解题报告

    P1272 重建道路 题目描述 一场可怕的地震后,人们用\(N\)个牲口棚\((1≤N≤150\),编号\(1..N\))重建了农夫\(John\)的牧场.由于人们没有时间建设多余的道路,所以现在从一 ...

  2. NOIP2017题解

    T1小凯的疑惑 小凯手中有两种面值的金币,两种面值均为正整数且彼此互素.每种金币小凯都有 无数个.在不找零的情况下,仅凭这两种金币,有些物品他是无法准确支付的.现在小 凯想知道在无法准确支付的物品中, ...

  3. 洛谷T31039 九尾狐吃棉花糖

    小伙伴出的题. 一眼看出是状压DP裸题.回忆poj2288 islands and bridges,然后就很好写了. 啪啪啪打了个状压DP出来(晚上寝室写的,其实是记忆化搜索),发现sum总是INF ...

  4. idea 设置console 无1024限制,复制到Excel分隔符\t

    在安装目录/bin中找到idea.properties文件, 更改idea.cycle.buffer.size项值为disabled,保存,重启idea Excel分隔符\t; 数字自动加逗号的情况, ...

  5. 流畅的python--python数据模型

    python最好的品质之一就是一致性.初步接触python可能会len(collection)而不是collection.len()觉得不适应,这是通常所说的“python风格”(Pythonic)的 ...

  6. ps -ef | grep Linux进程查看命令

    我们常常会想查看Linux的一些进程,很自然地用到了: ps -ef | grep xxx ps: process show 展示进程 参数:1. e 显示所有程序. 2. f  显示UID,PPIP ...

  7. 图论分支-Tarjan初步-点双连通分量

    上一次我们讲到了边双,这次我们来看点双. 说实话来说,点双比边双稍微复杂一些: 学完边双,我们先看一道题 第一问都不用说了吧,多余的道路,明显的割边. 是不是首先想到用边双,但是我们来看一个图: 有点 ...

  8. 字符设备驱动(六)按键poll机制

    title: 字符设备驱动(六)按键poll机制 tags: linux date: 2018-11-23 18:57:40 toc: true --- 字符设备驱动(六)按键poll机制 引入 在字 ...

  9. Spring_事务管理

    转自:https://www.ibm.com/developerworks/cn/java/j-master-spring-transactional-use/index.html 事务管理是应用系统 ...

  10. Scrapy Shell的使用

    Scrapy终端是一个交互终端,我们可以在未启动spider的情况下尝试及调试代码,也可以用来测试XPath或CSS表达式,查看他们的工作方式,方便我们爬取的网页中提取的数据. 如果安装了 IPyth ...