Как скрыть части HTML, когда JavaScript отключен?

Я пытаюсь разместить пользователей без JavaScript. (Кстати, стоит ли это в настоящее время?)Как скрыть части HTML, когда JavaScript отключен?

В одном файле HTML я хотел бы, чтобы часть его выполнялась, если скрипты на, а другая часть, если скрипты выключены.

Тег <noscript> позволяет мне делать первое, но как достичь последнего? Как я могу пометить часть HTML, чтобы он не анализировался браузером, если сценарии выключены?

источник

2009-10-16 z-boss

вот видео-учебник о том, как это можно сделать с помощью JQuery: http://screenr.com/ya7

Код:

<body class="noscript"> 
<script> 
$('body').removeClass('noscript'); 
</script> 
</body>

А потом просто скрыть соответствующие элементы под body.noscript соответственно.

редактировать Однако JQuery может быть раздутым для небольшого исправления, как этот, так что я предлагаю Zauber Paracelsus' answer, так как он не требует JQuery.

источник

2009-10-16 11:56:26 Natrium

@ user2667066 Я думаю, что вы прокомментировали неправильный ответ, так как это _is_ по умолчанию и требует JQuery. – Natrium

Eidited and mov, sorry – user2667066

По умолчанию бит, который вы хотите скрыть, в стиле display:none и включить их с помощью jQuery или JavaScript.

источник

2009-10-16 11:50:08

событие onready - хороший способ пойти – Ismael

JQuery путь:

$(document).ready(function(){ 
    $("body").removeClass("noJS"); 
});

Псевдо CSS

body 
    .no-js-content 
     display: none; 
body.noJS 
    .main 
     display: none; 
    .no-js-content 
     display: block;

HTML

<body class="noJS"> 
    <div class="main"> 
     This will show if JavaScript is activated 
    </div> 
    <div class='no-js-content'> 
     This will show when JavaScript is disabled 
    </div> 
</body>

источник

2009-10-16 11:56:23

Кстати, стоит ли это усилий в настоящее время?

Да, стоит беспокоиться о доступности. Вы должны использовать прогрессивное улучшение, где это возможно, т. Е. Создать базовую версию, которая работает без сценариев, а затем добавить поверх нее скриптовые функции.

Простым примером может быть всплывающая ссылка. Вы могли бы сделать один такой:

<a href="javascript:window.open('http://example.com/');">link</a>

Однако эта ссылка не будет работать, если кто-то, скажем, средний щелчок или пытался сделать закладку, или что скрипты отключены и т.д. Вместо этого, вы могли бы сделать то же самое как это:

<a href="http://example.com/" 
    onclick="window.open(this.href); return false;">link</a>

это все еще не совершенен, потому что вы должны отделить поведение и структура слоев и избежать встроенных обработчиков событий, но это лучше, потому что это более доступным и не требует сценариев.

источник

2009-10-16 12:02:53 slikts

Вам даже не нужен JavaScript. Просто назовите свою цель (или используйте «target =» _ blank »') – Joe

Я не думаю, что это была точка, в которой Рейнис получал – roryf

Если содержание имеет смысл только в том случае, если JavaScript включен, то он должен быть вставлен кодом JavaScript напрямую, а не визуализирован. Это можно сделать, просто используя HTML-шаблоны в виде строк в вашем JavaScript-коде или используя Ajax, если HTML-код более сложный.

Как mentioned by Reinis I. это идея Progressive Enhancement.

Что касается CSS-методов использования имени класса в теге body, я бы посоветовал сделать это наоборот и добавить класс body-js-enabled в тег body с JavaScript, который изменит CSS страницы. Это вписывается в мой вышеприведенный комментарий о сохранении исходного HTML-кода, не поддерживающего JavaScript.

источник

2009-10-16 12:14:48 roryf

Я искал способ сделать это, чтобы я мог скрывать раскрывающееся меню навигации, которое становится рендечным нефункциональным при включении javascript. Однако все решения для изменения свойства отображения не работали.

Итак, сначала мне присвоили идентификатор (ddown) элементу div, окружающему раскрывающееся меню.

Затем в головной части HTML-документа, я добавил это в:

<noscript> 
    <style> 
     #ddown {display:none;} 
    </style> 
</noscript>

И это просто работал. Никакой зависимости от javascript, jquery и других скриптов: просто чистый HTML и CSS.

источник

2012-12-13 10:25:02

. Это должен быть ответ по умолчанию - простой и не нужен JQuery – user2667066

По какой-то причине это isn «Я правильно работаю на своей странице. Даже если JS включен, он по-прежнему скрывает селектор в ''. Кстати, моя страница - XHTML. – alej27

Как скрыть части HTML, когда JavaScript отключен?

ответ

Смежные вопросы