4

我正在尝试获取已写入不同 CSS 文件的元素背景样式。问题是我无法获得写在 CSS 文件中的样式。

另一方面,可以得到已经写在 HTML 文档上的样式。

CSS 代码

#try2
{ 
    background-color:yellow;
}
body
{
    background-color:gray;
}
td, th{
    border: 1px solid black;
}

HTML 代码

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1255" />
        <link rel="stylesheet" type="text/css" href="html.css">
        <script type="text/javascript" src="external.js"></script>
    </head>
    <body>
        <table>
            <tr>
                <td id = "try1" style="background-color:green;"><p id="ChosenColor3"> htmlfile</p></td>
            </tr>
            <tr>
                <td id = "try2"><p id="ChosenColor4"> css file</p></td>
                <td><button id="bestRated3" onclick = arrayTest()> ב.מ </button></td>
                <td><button id="submitForm" onclick = submit()> end</button></td>
            </tr>
            <tr>
                <td><h1 id="ChosenColor5"> text </h1></td>  
            </tr>
        </table>
    </body>
    <script>
        window.onload=aaa();
        function aaa()
        {
            var x = document.getElementById("try2");
            alert(x.style.background);
        }
    </script>     
</html>

如您所见,我收到的消息是空的。如果我将 ID 更改为“ try1”,它将显示出来。

4

5 回答 5

9

style属性允许您读取和写入每个元素的styleHTML 属性的值(称为它的内联样式)——它不考虑样式表。

要发现 CSS 属性的真正价值是什么,您必须改为使用window.getComputedStyle,例如:

alert(getComputedStyle(x, null).getPropertyValue("background-color"));

看到它在行动

请注意,getComputedStyleIE 8 或更早版本不支持。

于 2013-09-04T08:18:51.800 回答
1

将您的警报更改为alert(x.style.backgroundColor);

style.backgroundstyle.backgroundColor是两个不同的东西。

于 2013-09-04T08:17:33.563 回答
1

试试这个

   function aaa()
        {
           var a = document.getElementById("try2").style.backgroundcolor;
           alert("Your background color is :"+a);
        }
于 2013-09-04T08:24:08.803 回答
0

改用这个:

alert(x.style.backgroundColor);
于 2013-09-04T08:17:45.157 回答
0

您尚未分配背景值。所以使用这样的东西:

alert(x.style.background="red");

演示

于 2013-09-04T08:19:34.180 回答