0

这是问题所在,我需要获取 div 的 css 属性。该 css 位于<style></<style>.

发生的情况是返回了一些 css 属性,而没有返回一些。

以下是代码,这是我修改的示例。

如果您运行该示例;您会看到边框宽度、边框颜色和边框样式不返回值。我究竟做错了什么?

<!DOCTYPE html>
<html>
<head>
<style>
div { height: 50px; margin: 5px; padding: 5px; float: left}
#box1 { width: 50px; color: yellow; background-color: blue;  border-width:2px; border-color:#0C6; border-style:solid}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p id="result">&nbsp;</p>
<div id="box1">1</div>
<script>
$("div").click(function () {
var html = ["The clicked div has the following styles:"];
var styleProps = $(this).css( ["border-width","border-color","border-style","width", "height", "color", "background-color"] );
$.each( styleProps, function( prop, value ) {
html.push( prop + ": " + value );
});
$( "#result" ).html( html.join( "<br>" ) );
});
</script>
</body>
</html>

感谢您的任何想法或建议。我应该提一下,这段代码适用于 Chrome。我用 FF18 测试过,前三个 css 值没有返回。

4

2 回答 2

0

我发现我的代码有问题。显然在 FF 18 中,您必须指定完整的 css 值,而不是快捷方式。

这是我的解决方案,我指定了完整的 css 属性,如下所示。

border-bottom-color:green;
border-bottom-style:solid;
border-bottom-width:2px;

然后我的 jquery 检索值如下:

var styleProps = $(this).css( ["border-bottom-width","border-bottom-color","border-bottom-style","width", "height", "color", "background-颜色”] );

这应该适用于所有具有快捷方式的 css 属性。

感谢所有帮助解决这个问题的人。

谢谢

克里斯

于 2013-01-21T21:24:21.337 回答
0

只需使用.css()

$(element).css();

或使用 HTML

<html>
    <head>
        <title>Computed Style Example</title>
        <style type="text/css">
            div.special {
                background-color: red;
            }
        </style>
        <script type="text/javascript">
            function getBackgroundColor() {
                var oDiv = document.getElementById("div1");
                alert(document.defaultView.getComputedStyle(oDiv, null).backgroundColor);
            }
        </script>

    </head>
    <body>
        <div id="div1" class="special"></div>
        <input type="button" value="Get Background Color" onclick="getBackgroundColor()" />

    </body>
</html>
于 2013-01-21T19:00:27.257 回答