удаление класса no-js в теге html с помощью jquery - PullRequest
Новая
       0

удаление класса no-js в теге html с помощью jquery

4 голосов
/ 10 сентября 2011

Глядя на один проект jquery, я нашел следующую строку: 

var Application=function(c){
    $("html:first").removeClass("no-js");
}

Хотелось бы понять эту строчку, и какова его цель?

Ответы [ 2 ]

4 голосов
/ 10 сентября 2011

Эта строка jQuery удаляет класс no-js из тега html. Класс no-js, вероятно, был установлен в HTML. Смысл этого в том, чтобы сообщить CSS, включен ли JS.
Например, у меня может быть <div>, который я хочу добавить, когда пользователь нажимает кнопку. Сначала div нужно скрыть, поэтому я могу сделать это в CSS: 

#theDiv {
  display: none;
}

Тогда я использую этот jQuery, когда они нажимают на кнопку: 

$('#theDiv').fadeIn()

Но теперь у нас проблема. Если у пользователя включен JS, все работает хорошо. Но если у них не включен JS, то окно остается скрытым и никогда не появляется. Добавляя следующий CSS, мы показываем окно, если JS выключен: 

.no-js #theDiv {
  display: block;
}

Затем мы добавляем класс в тег html: 

<html class="no-js">

Теперь, если JS включен, JS удаляет класс no-js, и поле остается скрытым до тех пор, пока JS не исчезнет. Если JS выключено, поле всегда отображается.
Надеюсь, это поможет!

2 голосов
/ 10 сентября 2011

Это для разлагаемости Javascript.

Например, скажем, у вас есть что-то на странице, которая скрыта, и затем становится видимой, когда кто-то щелкает что-то с помощью JS. Если бы посетитель пришел на сайт с отключенным JS, не было бы простого способа увидеть скрытый контент.

Чтобы обойти это, вы можете настроить специальный CSS, который запускается только при выключенном JS, с помощью класса no-js в корне страницы и удалением этого класса на страницах, на которых запущен JS. 

.hidden {
  display: none;
}

.no-js .hidden {
  display: block;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...