js获取元素外链样式的方法


Posted in Javascript onJanuary 27, 2015

本文实例讲述了js获取元素外链样式的方法。分享给大家供大家参考。具体分析如下:

一般给元素设置行内样式,如<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="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>也要点击我~O(∩_∩)O~。</p>
</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
ExtJS 2.0实用简明教程之应用ExtJS
Apr 29 Javascript
Js,alert出现乱码问题的解决方法
Jun 19 Javascript
JS两种定义方式的区别、内部原理
Nov 21 Javascript
Javascript玩转继承(三)
May 08 Javascript
seajs加载jquery时提示$ is not a function该怎么解决
Oct 23 Javascript
jquery实现页面加载效果
Feb 21 Javascript
聊聊JavaScript如何实现继承及特点
Apr 07 Javascript
JS去掉字符串中所有的逗号
Oct 18 Javascript
vue项目中定义全局变量、函数的几种方法
Nov 08 Javascript
浅析Vue下的components模板使用及应用
Nov 27 Javascript
微信小程序停止其他视频播放当前视频的实例代码
Dec 25 Javascript
JS绘图Flot如何实现可选显示曲线图功能
Oct 16 Javascript
jquery复选框多选赋值给文本框的方法
Jan 27 #Javascript
jQuery+ajax实现动态执行脚本的方法
Jan 27 #Javascript
javascript将异步校验表单改写为同步表单
Jan 27 #Javascript
JavaScript中实现sprintf、printf函数
Jan 27 #Javascript
javascript批量修改文件编码格式的方法
Jan 27 #Javascript
JavaScript中的包装对象介绍
Jan 27 #Javascript
浅谈JSON中stringify 函数、toJosn函数和parse函数
Jan 26 #Javascript
You might like
PHP5中的时间相差8小时的解决办法
2008/03/28 PHP
浅析PHP微信支付通知的处理方式
2014/05/25 PHP
php文件上传你必须知道的几点
2015/10/20 PHP
php实现购物车产品删除功能(2)
2020/07/23 PHP
JS 分号引起的一段调试问题
2009/06/18 Javascript
js操作textarea方法集合封装(兼容IE,firefox)
2011/02/22 Javascript
js取滚动条的尺寸的函数代码
2011/11/30 Javascript
不用构造函数(Constructor)new关键字也能实现JavaScript的面向对象
2013/01/11 Javascript
Jquery Validate 正则表达式实用验证代码大全
2013/08/23 Javascript
javascript学习笔记(三)BOM和DOM详解
2014/09/30 Javascript
nodeJs爬虫获取数据简单实现代码
2016/03/29 NodeJs
js时间查询插件使用详解
2017/04/07 Javascript
配置nodejs环境的方法
2017/05/13 NodeJs
JS实现页面内跳转的简单代码
2017/09/03 Javascript
nodejs socket服务端和客户端简单通信功能
2017/09/14 NodeJs
微信小程序多音频播放进度条问题
2018/08/28 Javascript
微信小程序可滑动周日历组件使用详解
2019/10/21 Javascript
Kettle中使用JavaScrip调用jar包对文件内容进行MD5加密的操作方法
2020/09/04 Javascript
[02:32]DOTA2英雄基础教程 美杜莎
2014/01/07 DOTA
使用python编写udp协议的ping程序方法
2018/04/22 Python
Python中Numpy mat的使用详解
2019/05/24 Python
解决python3插入mysql时内容带有引号的问题
2020/03/02 Python
python读取当前目录下的CSV文件数据
2020/03/11 Python
django创建超级用户时指定添加其它字段方式
2020/05/14 Python
使用pandas读取表格数据并进行单行数据拼接的详细教程
2021/03/03 Python
Html5实现iPhone开机界面示例代码
2013/06/30 HTML / CSS
中国专业的音频分享平台:喜马拉雅
2019/05/24 全球购物
Jacadi Paris英国官网:法国童装品牌
2019/08/09 全球购物
物价局领导班子四风问题整改措施
2014/10/26 职场文书
司法局2014法制宣传日活动总结
2014/11/01 职场文书
个人汇报材料范文
2014/12/30 职场文书
2015社区个人工作总结范文
2015/05/13 职场文书
复兴之路观后感
2015/06/02 职场文书
党员反四风学习心得体会
2016/01/22 职场文书
Python中的tkinter库简单案例详解
2022/01/22 Python
MySQL时区造成时差问题
2022/04/13 MySQL