Как узнать, когда динамически загруженный файл CSS полностью загружен и активен? - PullRequest
Новая
       1

Как узнать, когда динамически загруженный файл CSS полностью загружен и активен?

2 голосов
/ 29 марта 2012

Я использовал методику, описанную в посте в StackOverflow , для динамического добавления файла CSS в тег HEAD HTML-страницы (в JavaScript).Метод проверки того, был ли файл CSS полностью загружен (см. Тот же пост), описан его автором как «некрасивый», и, на мой взгляд, так и есть ;-) Тем не менее другой пост предлагает использовать «ленивый».загрузчик »(см. принятый ответ в этом посте), который учитывает проблемы, связанные с кроссбраузерностью.Хотя код выглядит хорошо, он кажется довольно сложным для поставленной задачи.

Мой вопрос таков: более чем через год после поста, который я упомянул в последний раз (и много улучшений в методах браузера),существует ли надежный кросс-браузерный способ проверки того, готов ли динамически загруженный файл CSS?

Ответы [ 2 ]

0 голосов
/ 30 декабря 2013

Вы можете достичь этого, загрузив свой CSS-файл с img. 

var img = document.createElement("img");

img.onerror = function()
{
    console.log("loaded");
}

img.src = url;

Более подробная информация здесь: http://www.backalleycoder.com/2011/03/20/link-tag-css-stylesheet-load-event/

0 голосов
/ 29 марта 2012

попробуй что-нибудь вот так 

(function() {
    function cssLoader(url) {
        var link = document.createElement("link");
        link.onload = function(){
            console.log('loaded');
        };
        link.setAttribute("rel", "stylesheet");
        link.setAttribute("type", "text/css");
        link.setAttribute("href", url);
        document.getElementsByTagName("head")[0].appendChild(link)
    }

    cssLoader('http://jsfiddle.net/css/style.css');

}());​
...