javascript取得css中的属性值

最新推荐文章于 2022-11-08 23:30:47 发布
最新推荐文章于 2022-11-08 23:30:47 发布
阅读量597 收藏
点赞数
分类专栏： javascript 文章标签： javascript css string null
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tdy002/article/details/7520792
版权

<html>
<head>
<title>javascript取得css中的属性值</title>
<style type="text/css">
#demo {
 width: 200px;
 height: 100px;
 background-color: #333;
 color: red;
 padding: 10px;
}
</style>

<script type="text/javascript">
/*
obj：  DOM对象或者是对象的id
styleName： 需要访问的样式名称，不能用"-"号，需要采用驼峰标识。
注意：background-color需要写成backrgoundColor。
在ff下，访问padding,margin样式有问题。
*/
function returnStyle(obj, styleName) {
 var myObj = typeof dom == "string" ? document.getElemenetById(obj) : obj;
 if(document.all) {
  return eval(myObj + ".currentStyle." + styleName);
 } else {
  return eval("document.defaultView.getComputedStyle(" + myObj + ", null)." + styleName);
 }
}
</script>

</head>
<body>
<div id="demo">内容</div>
</br><br/>
<a href="javascript:void(0);" οnclick="alert(returnStyle('demo', 'width'));">点击这里取得内容的宽</a>
</body>
</html>

tdy002
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript 获取特定的 CSS属性值
gyk20000215的博客
09-25 342
Example Source Code global.css声明 &nbsp;Example Source Code #myArticle{ width:400px; height:300px; } ... 　　这样情况，直接通过JS进行getElementById(’myArticle’).style.width无法获取400px值，因这数值定CSS里，所，必须其方法，写函数： &nbs...
css中样式类型及属性值的获取
weixin_41897680的博客
08-13 3588
css中样式类型及属性值的获取
使用JavaScript删除CSS属性
qq_43067585的博客
05-27 3324
如何使用JavaScript删除CSS属性？下面本篇就来给大家介绍一下使用JavaScript删除CSS属性的方法，希望对大家有所帮助。 方法一：使用removeProperty()方法 removeProperty()方法用于从元素的样式中移除属性。元素的样式是通过styleSheets数组并选择cssRules来选择的，然后使用RemoveProperty方法指定要删除的属性。 语法： element.removeProperty('property') 示例： <!DOCTY
如何使用JavaScript删除CSS属性？
W Y L
08-24 4501
方法1：使用cssremoveProperty：该CSSStyleDeclaration.removeProperty()方法被用来从一个元件的样式删除一个属性。 通过遍历styleSheets数组并选择cssRule，可以选择元素的样式。然后可以使用要删除的属性指定removeProperty方法。 句法： element.removeProperty('property') 案例： <!DOCTYPE html> <html> <head> <title
CSS 中 position属性介绍
11-08 1852
CSS 中 position属性介绍
使用 JavaScript 更改 CSS 示例
allway2的博客
06-10 4376
JavaScript 都是关于动态的东西，处理动态 CSS 更改只是 JavaScript 正是我们需要的场景之一。使用 JavaScript，我们可以为 DOM 中的一个或多个元素设置 CSS 样式，修改它们，删除它们，甚至更改所有页面的整个样式表。让我们来看看我们可以做到这一点的不同方法：直接从 JavaScript 设置单个样式是处理动态 CSS 样式时最常见的场景之一。这种方式允许您更改 DOM 中存在的一个或多个元素的 CSS 样式。你所要做的就是： 如果您像这样执行此代码，您会注意到更改
js获取css属性值
热门推荐
天空影
03-21 2万+
因为之前用惯了jq来获取和设置css属性，然后在做demo不使用jq的情况下，竟然在这一点上碰到了问题，然后就自个搜了搜为什么，在查看了很多文档和博客之后才终于搞明白了。 &lt;style&gt; .box{ width:200px; height:200px; border:1px solid red; text-align: center; } &lt;/s...
CSS中 自定义属性（变量）详解
明天也要努力的博客
06-04 8859
自定义属性（有时也被称作CSS变量或者级联变量）是由CSS作者定义的，它包含的值可以在整个文档中重复使用。 由自定义属性标记设定值（比如： --main-color: black;），由 var() 函数来获取值（比如： color: var(–main-color);） 复杂的网站都会有大量的CSS代码，通常也会有许多重复的值。 举例：同样一个颜色值可能在成千上百个地方被使用到，如果这个值发生了变化，需要全局搜索并且一个一个替换。 自定义属性在某个地方存储一个值，然后在其他许多地方引用它。另一个好处是语义
JavaScript修改Css样式
zhansan的博客
06-03 3374
javascript修改css
CSS&JavaScript讲解
weixin_51094637的博客
03-29 2068
CSS 概念 全称：Cascading Style Sheets 层叠样式表（用于美化页面，布局页面） 层叠：多个样式可以作用在同一个html的元素上，同时生效 好处： 功能强大 将内容展示和样式控制分离： ①降低耦合度，解耦 ②让分工写作更容易 ③提高开发效率 CSS的使用 ①内联样式：在标签内使用style属性指定css代码 如：<div style="color:red;">hello css</div> ②内部样式:在head标签内，定义style标签，
用javascript获得css中的属性值的代码
10-30
JavaScript 获取 CSS 属性值的代码 在 Web 开发中，获取 CSS 属性...在本文中，我们介绍了使用 JavaScript 获取 CSS 属性值的几种方法，并讨论了它们的优缺点。我们还讨论了获取 CSS 属性值在 Web 开发中的实际应用。
用JavaScript修改CSS属性的代码
12-03
用JavaScript修改CSS属性 只有写原生的javascript了。 1.用JS修改标签的 class 属性值： class 属性是在标签上引用样式表的方法之一，它的值是一个样式表的选择符，如果改变了 class 属性的值，标签所引用的样式表也...
Javascript获取background属性中url的值
11-29
最近在做项目的时候遇到一个问题，需要获取一个动态预览的图片的地址，这其实不是什么问题，主要是该图片的路径是写在css的background-img属性中的，于是决定要用js获取它的url中的内容，下面给大家分享解决的方法，...
jsp中java变量赋值给javascript变量
tdy002的专栏
04-09 7471
pageEncoding="UTF-8"%>      String message = "Th\r\nis is a \"test\" St\nring."; %>     http://www.w3.org/TR/html4/loose.dtd"> java变量赋值给javascript变量     var jsStr = "\\\"").repl
扩展IE不支持的属性HTMLElement，在每个获取的元素下，加上指定的方法
tdy002的专栏
05-19 3183
var domMethod = { extendDom: function(name, fn) { if(!document.all) { //不是ie浏览器 HTMLElement.prototype[name] = fn; } else { //将原来的document.createElement方法赋给临时变量 var _createEleme
JavaScript的window.onload特性
tdy002的专栏
05-15 984
function one(){alert("one")} function two(){alert("two")} window.onload = one; window.onload = two; 这样做，第二个函数two会把第一个函数one给覆盖掉 如果要想两个函数都加载执行，则可以自己写个辅助函数实现 function addLoadEvent(func) { //将wi
利用javascript取得css中的属性值
tdy002的专栏
05-03 690
var css = {  getStyle: function(elem, styles) {   var value;   elem = document.getElementById(elem);   if(styles == "float") {    document.defaultView ? styles = 'float': styles = 'styleFloat';
css中获取元素的属性值
最新发布
05-23
在CSS中，可以使用以下方式获取元素的属性值： 1. 使用属性选择器：可以通过元素的属性名称和属性值来选择元素并获取其属性值。 例如，要获取所有class属性值为"example"的元素的文本颜色，可以使用以下CSS代码： ``` .example { color: red; } ``` 2. 使用伪类选择器：可以使用伪类选择器来获取元素的某些状态的属性值，例如:hover，:active等。 例如，要获取所有鼠标悬停在链接上的链接的颜色，可以使用以下CSS代码： ``` a:hover { color: blue; } ``` 3. 使用JavaScript：可以使用JavaScript来获取元素的属性值，例如使用document.getElementById()方法获取元素的id属性值。 例如，要获取id为"myElement"的元素的背景颜色，可以使用以下JavaScript代码： ``` var element = document.getElementById("myElement"); var bgColor = element.style.backgroundColor; ``` 注意，使用JavaScript获取元素的属性值通常需要在DOM加载后进行。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值