0
100
2018-12-26

Как подключить файл стилей через jQuery скрипт

Рассмотрим работающий пример того как можно подключить фал стилей CSS через jQuery скрипт
Понравилась страница? Поставь свою оценку!
PLUGIN_STAR_RATINGS.SCORE_TEXTPLUGIN_STAR_RATINGS.VOTES_TEXT

Данный пример поможет подключить любой файл стилей к вашей странице сайта без особых знаний JavaScript. В примере моего кода, jQuery скрипт подключит файл стилей только в случае если на странице есть данный блок:

body.kc-live-editor.kc-request-iframe

jQuery скрипт для подключения файла с стилями

Код который необходимо добавить в файл скриптов своей темы:

jQuery(document).ready(function($){
    $('button').click(function(){
        /*===========
        // В случае если необходимо задать правило отображения в зависимости от присутствия блока на странице
        ===========*/
        if ($('body').length > 0) {

            /*--------------------------------------- */
            console.log('Да, сейчас страница загрузилась и готова к вставке CSS файла');

            var ss = document.createElement("link");
            ss.rel = "stylesheet";
            ss.href = "//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css";
            ss.type = "text/css";
            ss.media = "all";
            document.getElementsByTagName("head")[0].appendChild(ss);

            console.log('CSS файл добавлен');
            /*---------------------------------------*/
        };
        /*===========
        // В случае если необходимо задать правило отображения в зависимости от присутствия блока на странице
        ===========*/
    });
});

В данной строке:

"//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css";

Замените путь на свой, то есть вы должны указать путь к своему файлу стилей.

Пример работы скрипта в CodePen