一般给元素设置行内样式，如<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. 用C结构体来实现面向对象编程，ti xDAIS标准算法就这么搞的（1）

    用C结构体来实现面向对象编程,ti xDAIS标准算法就这么搞的. 测试代码如下: #include <stdio.h> #include <stdlib.h> #includ ...

  2. php -- 实现linux关机、重启功能

    有时候,我们自己可以DIY一个控制面板实现linux的关机重启功能.众所周知,linux是一个基于文件的操作系统,所以要实现系统的关机重启功能必须满足以下两点 一.知道命令的绝对路径 在linux下操 ...

  3. Storm On YARN带来的优点

    1)弹性计算资源     将storm执行在yarn上后,Storm能够与其它计算框架(如mapreduce)共享整个集群的资源.这样当Storm负载骤增时,可动态为它添加计算资源. 负载减小时,能够 ...

  4. 修改php上传文件尺寸、响应时间、时区时间等设置

    修改php上传文件尺寸.响应时间 1.修改php.ini 1.post_max_size 指通过表单POST给PHP的所能接收的最大值,包括表单里的所有值,默认为8M(改为150M),看你自己需要进行 ...

  5. 不错的源码演示：admin5源码

    admin5源码官网:http://down.admin5.com/ 集资讯,源码,字体,itchat于一体的网站,可以下载喔! 实际项目中可以用得到.

  6. 学习 TList 类的实现[4]

    现在准备一步步地模拟 TList 类, 建立一个自己的 TMyList. 首先, 这个类中应该包括前面提到的那个 Pointer 数组(TPointerList)的指针(PPointerList): ...

  7. linux 数据盘和系统盘的查看

    系统盘就像linux的c盘,使用df -l命令查看 如下所示: 可以看到根路径 / 都是位于系统盘.而/root,/home,/usr就如同c盘下的c:\windows,c:\usr这些目录 如果单独 ...

  8. Java精选笔记_XML基础

    XML基础 XML概述 W3C组织简介 W3C是World Wide Web Consortium(万维网联盟)的缩写,它是对网络标准定制的一个非赢利组织,如HTML.XHTML.CSS.XML的标准 ...

  9. Java精选笔记_JSP开发模型

    JSP开发模型 JSP Model JSP Model1简单轻便,适合小型Web项目的快速开发. JSP Model2模型是在JSP Model1的基础上提出的,它提供了更清晰的代码分层,更适用于多人 ...

  10. 关于直播学习笔记-005-nginx-rtmp-win32在Win10上使用

    在Win10上使用nginx-rtmp-win32会提示文件路径问题. 可以将nginx-rtmp-win32拷贝到用户目录文件夹之中. 在命令行中执行nginx.exe程序