Как скрыть элементы с jQuery, прежде чем они будут представлены?
Я хочу генерировать расположение HTML с областями (отделения, промежутки), который может быть показан/скрыт условно. Эти области скрыты по умолчанию.
Если я называю .hide () методом с jQuery на document.ready, эти области могут мигнуть (рендеринг браузеров частично загруженные документы). Таким образом, я применяю "дисплей: ни один" не разрабатывает в расположении HTML.
Интересно, что является лучшей практикой, чтобы не мигать, потому что применение "display:none" нарушает правило incapsulation - я знаю то, с чем делает jQuery, скрываются/показывают и используют его. Если реализация сокрытия/показа jQuery изменится однажды, я получу целый неосуществимый сайт.
Заранее спасибо
3 ответа
Нет абсолютно ничего плохого в установке свойства intial display элемента, особенно если вы заключаете его в css-класс.
Обычно я устанавливаю класс .js для моего элемента, чтобы установить нужное свойство, когда javascript включен.
Затем я могу настроить CSS в зависимости от того, присутствует или нет javascript.
например:
<html class="js">
<body>
<div id="foo"></div>
</body>
</html>
мой css :
html.js #foo
{
display: none;
}
и javascript
$(document).ready(
function()
{
$(html).addClass('js');
}
);
вы можете применить "display: none" в классе CSS.
Потому что порядок, в котором браузер должен прочитать некоторый HTML-код, чтобы JavaScript нашел элемент. Вы должны пометить элемент как скрытый, поскольку браузер читает ваш HTML.
Как бы то ни было, вы также можете вставить HTML в свой JavaScript, и вы можете вызвать hide до того, как он будет отображен.