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 相关文章推荐
firefox 和 ie 事件处理的细节,研究,再研究 书写同时兼容ie和ff的事件处理代码
Apr 12 Javascript
DWZ刷新dialog解决方法
Mar 03 Javascript
让input框实现类似百度的搜索提示(基于jquery事件监听)
Jan 31 Javascript
使用coffeescript编写node.js项目的方法汇总
Aug 05 Javascript
详解javascript中的事件处理
Nov 06 Javascript
基于JS实现发送短信验证码后的倒计时功能(无视页面刷新,页面关闭不进行倒计时功能)
Sep 02 Javascript
js实现对table的增加行和删除行的操作方法
Oct 13 Javascript
loading动画特效小结
Jan 22 Javascript
JS实现微信摇一摇原理解析
Jul 22 Javascript
Vue插值、表达式、分隔符、指令知识小结
Oct 12 Javascript
Vue 3.0中jsx语法的使用
Nov 13 Javascript
vue 动态生成拓扑图的示例
Jan 03 Vue.js
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
怎么使 Mysql 数据同步
2006/10/09 PHP
sae使用smarty模板的方法
2013/12/17 PHP
php页面函数设置超时限制的方法
2014/12/01 PHP
php实现的一段简单概率相关代码
2016/05/30 PHP
基于Laravel(5.4版本)的基本增删改查操作方法
2019/10/11 PHP
JavaScript 保存数组到Cookie的代码
2010/04/14 Javascript
Javascript倒计时代码
2010/08/12 Javascript
最新最热最实用的15个jQuery插件汇总
2015/07/05 Javascript
全面解析Bootstrap弹窗的实现方法
2015/12/01 Javascript
微信小程序 解析网页内容详解及实例
2017/02/22 Javascript
js es6系列教程 - 基于new.target属性与es5改造es6的类语法
2017/09/02 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
2017/12/07 Javascript
详解关于element级联选择器数据回显问题
2019/02/20 Javascript
改进 JavaScript 和 Rust 的互操作性并深入认识 wasm-bindgen 组件
2019/07/13 Javascript
js实现简单选项卡制作
2020/08/05 Javascript
python使用clear方法清除字典内全部数据实例
2015/07/11 Python
Python+django实现文件下载
2016/01/17 Python
python使用turtle库绘制树
2018/06/25 Python
python中时间模块的基本使用教程
2019/05/14 Python
Python 如何优雅的将数字转化为时间格式的方法
2019/09/26 Python
python打开使用的方法
2019/09/30 Python
python3的pip路径在哪
2020/06/23 Python
python上下文管理器异常问题解决方法
2021/02/07 Python
html5的input的required使用中遇到的问题及解决方法
2018/04/24 HTML / CSS
UNIX操作系统结构由哪几部分组成
2016/02/17 面试题
大学毕业后的十年规划
2014/01/07 职场文书
数控专业自荐书范文
2014/03/16 职场文书
反邪教警示教育方案
2014/05/13 职场文书
公安机关正风肃纪剖析材料
2014/10/10 职场文书
2014年干部培训工作总结
2014/12/17 职场文书
2015年护士节活动总结
2015/02/10 职场文书
管理失职检讨书
2015/05/05 职场文书
院系推荐意见
2015/06/05 职场文书
《蜜蜂引路》教学反思
2016/02/22 职场文书
pygame面向对象的飞行小鸟实现(Flappy bird)
2021/04/01 Python
Redis特殊数据类型Geospatial地理空间
2022/06/01 Redis