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 相关文章推荐
jquery ajax执行后台方法
Mar 18 Javascript
Jquery post传递数组方法实现思路及代码
Apr 28 Javascript
window.location.href = window.location.href 跳转无反应 a超链接onclick事件写法
Aug 21 Javascript
基于jquery异步传输json数据格式实例代码
Nov 23 Javascript
js获取UserControl内容为拼html时提供方便
Nov 02 Javascript
使用Chrome调试JavaScript的断点设置和调试技巧
Dec 16 Javascript
js实现表单多按钮提交action的处理方法
Oct 24 Javascript
Highcharts学习之数据列
Aug 03 Javascript
Json按某个键的值进行排序
Dec 22 Javascript
AngularJS自定义指令实现面包屑功能完整实例
May 17 Javascript
Vuex新手的理解与使用详解
May 31 Javascript
vue将文件/图片批量打包下载zip的教程
Oct 21 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
用PHP制作静态网站的模板框架(一)
2006/10/09 PHP
PHP新手上路(十)
2006/10/09 PHP
从一个不错的留言本弄的mysql数据库操作类
2007/09/02 PHP
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
2008/08/14 Javascript
javascript 实现 秒杀,团购 倒计时展示的记录 分享
2013/07/12 Javascript
兼容所有浏览器的js复制插件Zero使用介绍
2014/03/19 Javascript
JavaScript监听和禁用浏览器回车事件实例
2015/01/31 Javascript
js实现点击图片将图片地址复制到粘贴板的方法
2015/02/16 Javascript
jQuery实现文本展开收缩特效
2015/06/03 Javascript
js实现的万能flv网页播放器代码
2016/04/30 Javascript
浅谈JS的基础类型与引用类型
2016/09/13 Javascript
Javascript实现登录记住用户名和密码功能
2017/03/22 Javascript
python 从远程服务器下载东西的代码
2013/02/10 Python
python数据结构树和二叉树简介
2014/04/29 Python
Python中实现三目运算的方法
2015/06/21 Python
Python爬虫之xlml解析库(全面了解)
2017/08/08 Python
Python实现的递归神经网络简单示例
2017/08/11 Python
Python实现针对含中文字符串的截取功能示例
2017/09/22 Python
Python字典的基本用法实例分析【创建、增加、获取、修改、删除】
2019/03/05 Python
梅尔频率倒谱系数(mfcc)及Python实现
2019/06/18 Python
python实现文本进度条 程序进度条 加载进度条 单行刷新功能
2019/07/03 Python
django认证系统实现自定义权限管理的方法
2019/08/28 Python
DataFrame.to_excel多次写入不同Sheet的实例
2019/12/02 Python
浅谈tensorflow中张量的提取值和赋值
2020/01/19 Python
浅谈tensorflow之内存暴涨问题
2020/02/05 Python
Pytorch maxpool的ceil_mode用法
2020/02/18 Python
pyinstaller打包单文件时--uac-admin选项不起作用怎么办
2020/04/15 Python
python初步实现word2vec操作
2020/06/09 Python
Merchant 1948澳大利亚:新西兰领先的鞋类和靴子供应商
2018/03/24 全球购物
菲律宾购物网站:Lazada菲律宾
2018/04/05 全球购物
医生自荐信
2013/10/11 职场文书
投标单位介绍信
2014/01/09 职场文书
元宵节主持词
2014/03/25 职场文书
奥巴马胜选演讲稿
2014/05/15 职场文书
婚育证明格式
2015/06/17 职场文书
Redis基于Bitmap实现用户签到功能
2021/06/20 Redis