一般给元素设置行内样式,如<div id="div1" style="width:500px;"></div>。如要获取它的样式,即可document.getElementById("div1").style.width来获取或设置。但是如果样式是在外链link中的或者是页面的非行内样式,就获取不到了。

 在标准浏览器中可以通过window.getComputedStyll(obj,null)[property]来获取外链样式,但是在ie浏览器中则是通过obj.currentStyle来获取。

 完整html代码:
<!DOCTYPE html>
<html>
<head>
<title>js获取元素的外链样式-柯乐义</title><base target="_blank"/>
<style type="text/css">
p {
width: 500px;
line-height: 30px;
}
</style>
<script src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.2.min.js">
</script>
<script>
function getstyle(obj,property){
if(obj.currentStyle){
return obj.currentStyle[property];
}else if(window.getComputedStyle){
return document.defaultView.getComputedStyle(obj,null)[property];//或者也可以通过window.getComputedStyle来获取样式
}
return null;
} $(document).ready(function(){
$("p").click(function(){
alert(getstyle(this,"width"));
});
});
</script> </head>
<body>
<p style="width:750px;">如果您点击我,弹出宽度。</p>
<p>点击我,弹出宽度。</p>
<p>也要点击我哦。</p>
<div><a href="http://keleyi.com">首页</a> <a href="http://keleyi.com/keleyi/phtml/">特效库</a> <a href="http://keleyi.com/a/bjae/nb9lb3sd.htm">原文</a></div>
</body>
</html> 本文转载自柯乐义http://keleyi.com/a/bjae/nb9lb3sd.htm

js获取元素的外链样式的更多相关文章

  1. JS获取元素计算过后的样式

    获取元素计算过后的样式 Window.getComputedStyle() 方法会在一个元素应用完有效样式且计算完所有属性的基本值之后给出所有 CSS 属性的值. 语法: let style = wi ...

  2. JavaScript获取css 行间样式,内连样式和外链样式的方式

    [行间样式获取] <div id='div1' style="backgroud:red">测试</div> <script> var odiv ...

  3. Js获取元素样式值(getComputedStyle&currentStyle)兼容性解决方案

    因为:style(document.getElementById(id).style.XXX)只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. 一般js获取内部样式和外部样式使用 ...

  4. 原生js获取元素的样式信息

    工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...

  5. 原生js获取元素非行内样式属性的方法

    获取当前对象的样式DOM标准中的全局方法 getComputedStyle(obj).width (获取元素的宽度),但在非标准IE浏览器(IE8)以下有兼容问题IE8以下要这样写 obj.curre ...

  6. 【全面总结】js获取元素位置大小

    [js获取元素位置+元素大小]全面总结 目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) off ...

  7. js获取元素位置和style的兼容性写法

    今天说一下js获取元素位置和style的方法.当然不只是element.style那么简单.. 主角:getBoundingClientRect,getClientRects,getComputedS ...

  8. JS获取元素属性

    <style> *{ box-sizing: border-box; } html, body { margin: 0px; width: 100%; height: 100%; over ...

  9. JS获取元素宽高的两种情况

    JS获取元素宽高分两种情况, 一.内联样式,也就是直接把width和height写在HTML元素中的style里: 这种情况使用     document.getElementById('xxx'). ...

随机推荐

  1. .NET操作Excel笔记

    如果你新建一个项目的话,首先要添加Microsoft.Office.Core 与Microsoft.Office.Interop.Exce这两个应用,然后就能很方便的操作了,示例代码(只实现了简单的读 ...

  2. 关于HFile的存储结构梳理以及快速定位rowkey

    转自:http://blog.csdn.net/yangbutao/article/details/8394149 了解了布隆过滤器作用于HFile之上以及对HFile有了更深层次了解. 另有:htt ...

  3. C# winform 获取当前路径

    // 获取程序的基目录. System.AppDomain.CurrentDomain.BaseDirectory// 获取模块的完整路径.System.Diagnostics.Process.Get ...

  4. (转)SCR, PCR, ESCR, PTS, DTS

    1.       SCR SCR是存在于PS中的,即PS的pack里面的一个field.他用来指定这个PS的pack期望的到达decoder的时间. 2.       ESCR ESCR是位于PES里 ...

  5. 【Java面试题】45 什么是java序列化,如何实现java序列化?或者请解释Serializable接口的作用。

    我们有时候将一个java对象变成字节流的形式传出去或者从一个字节流中恢复成一个java对象,例如,要将java对象存储到硬盘或者传送给网络上的其他计算机,这个过程我们可以自己写代码去把一个java对象 ...

  6. mysql中/*!40000 DROP DATABASE IF EXISTS `top_server`*/;这中注释有什么作用?

    需求描述: 今天在进行mysqldump实验,使用--add-drop-databases参数,于是在生成的SQL文件中,就出现了. /*!40000 DROP DATABASE IF EXISTS ...

  7. React 生态系统:从小白到大神

    http://mp.weixin.qq.com/s/Epx46lznpnvgrIsbmAIZBA

  8. c# T obj = default(T);

    泛型类和泛型方法同时具备可重用性.类型安全和效率,这是非泛型类和非泛型方法无法具备的.泛型通常用在集合和在集合上运行的方法中..NET Framework 2.0 版类库提供一个新的命名空间 Syst ...

  9. mybatis由浅入深day01_ 7输入映射(7.1传递pojo的包装对象_7.2#{}与${}_7.3传递简单类型_7.4传递pojo对象_7.5传递hashmap)

    7 输入映射 通过parameterType指定输入参数的类型,类型可以是简单类型.hashmap.pojo的包装类型. 7.1 传递pojo的包装对象 7.1.1 需求 完成用户信息的综合查询,需要 ...

  10. Oracle-未能加载文件或程序集“oracle.dataaccess”或它的某一个依赖项。试图加载格式不正确的程序。

    未能加载文件或程序集“oracle.dataaccess”或它的某一个依赖项.试图加载格式不正确的程序. 说明: 执行当前 Web 请求期间,出现未经处理的异常.请检查堆栈跟踪信息,以了解有关该错误以 ...