Используйте JavaScript, чтобы получить стиль элемента из внешнего файла CSS - PullRequest
Новая
       2

Используйте JavaScript, чтобы получить стиль элемента из внешнего файла CSS

8 голосов
/ 01 апреля 2010

У меня есть HTML, как это: 

<html>
    <head>
        <link rel="stylesheet" type="text/css" media="all" href="style.css">
    </head>

    <body>
        <div id="test">Testing</div>

        <script>
            alert(document.getElementById('test').style.display);
        </script>
    </body>
</html>

style.css: 

div {
    display:none;
}

Я ожидаю, что js вернет "none", но вместо этого вернет пустую строку. Есть ли способ решить эту проблему?

Ответы [ 3 ]

5 голосов
/ 01 апреля 2010

Это будет работать для браузеров, соответствующих стандартам (не IE - currentStyle / runtimeStyle). 

<body>
    <div id="test">Testing</div>

    <script type="text/javascript">
        window.onload = function() {
            alert(window.getComputedStyle(document.getElementById('test'),null).getPropertyValue('display'));
        }
    </script>
</body>

3 голосов
/ 01 апреля 2010

Поскольку отображение не установлено непосредственно как свойство стиля, вы не получите его, используя приведенный выше код. Вы должны получить вычисленное значение.

Вы можете ссылаться на эту страницу, Получить стили

Чтобы получить значение 

var displayValue = getStyle("test", "display");

function getStyle(el,styleProp)
{
    var x = document.getElementById(el);
    if (x.currentStyle)
        var y = x.currentStyle[styleProp];
    else if (window.getComputedStyle)
        var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
    return y;
}
0 голосов
/ 01 апреля 2010

CSS еще не будет загружен. Оберните ваш JavaScript в событие «по готовности».

<body onload="alert(document.getElementById('test').style.display);">

Это работает для вас?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...