Разница между навязчивым и ненавязчивым JavaScript

Question

В чем разница между навязчивым и ненавязчивым javascript - на простом английском. Краткость ценится. Также приветствуются короткие примеры.

Answer 1

Я больше не одобряю это, поскольку оно действовало в 2011 году, но, возможно, не в 2018 году и далее.

Разделение интересов. Ваш HTML и CSSне привязаны к вашему JS-коду.Ваш код JS не встроен в какой-либо элемент HTML.Ваш код не имеет одной большой функции (или не функции) для всего.У вас есть короткие, краткие функции.

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

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

Не создавайте горы бесполезного кода , когда вам нужно только сделать что-то маленькое.Люди бесконечно усложняют свой код, переизбирая элементы DOM, обманывая семантический HTML и добавляя туда пронумерованные идентификаторы, и другие странные вещи, которые происходят из-за того, что они не понимают модель документа или какую-то другую технологию - поэтому они полагаются на"волшебные" слои абстракции, которые замедляют все до скорости мусора и приносят горы над головой.

Answer 2

Никакой JavaScript в разметке не является ненавязчивым:

<div id="informationHeader">Information</div>

навязчивым:

<div onclick="alert('obstrusive')">Information</div>

Answer 3

1. Разделение HTML и JavaScript (определите ваш JavaScript во внешних файлах JavaScript)
2. Изящная деградация ( важно части страницы по-прежнему работают с отключенным JavaScript).

Чтобы получить подробное объяснение, загляните на страницу Википедия по теме.

Answer 4

Чтобы расширить ответ Майка: использование UJS добавляется «позже».

<div id="info">Information</div>

... etc ...

// In an included JS file etc, jQueryish.
$(function() {
    $("#info").click(function() { alert("unobtrusive!"); }
});

UJS может также подразумевать легкую деградацию (мой любимый вид), например, еще один способ добраться до #info Нажмите функциональность, возможно, путем предоставления эквивалентной ссылки.Другими словами, что происходит, если нет JavaScript, или я использую программу чтения с экрана и т. Д.

Answer 5

ненавязчиво - «не навязчиво; незаметно, неуверенно или скрытно».

навязчивый - «имеющий или демонстрирующий склонность к навязчивости, например, навязывая свое мнение или мнение другим».

навязчиво - «толкать (что-то) вперед или на человека, особенно без ордера или приглашения»

Итак, говоря о навязывании своего мнения, на мой взгляд, наиболее важной частью ненавязчивого JavaScript является то, что с точки зрения пользователя не мешает. То есть сайт все равно будет работать, если JavaScript отключен настройками браузера. С включенным JavaScript или без него сайт будет по-прежнему доступен для людей, использующих программы чтения с экрана, клавиатуру без мыши и другие инструменты специальных возможностей. Возможно (возможно) сайт не будет таким «модным» для таких пользователей, но он все равно будет работать.

Если вы думаете о «прогрессивном улучшении», то основные функции вашего сайта будут работать для всех, независимо от того, как они к нему обращаются. Затем для пользователей с включенным JavaScript и CSS (большинство пользователей) вы расширяете его с помощью большего количества интерактивных элементов.

Другим ключевым «ненавязчивым» фактором является «разделение интересов» - то, о чем заботятся программисты, а не пользователи, но это может помочь не допустить навязывания сторонним пользователям опыта пользователя. С точки зрения программиста, избегание встроенного скрипта, как правило, делает разметку намного красивее и проще в обслуживании. Обычно намного проще отлаживать сценарий, который не разбросан по множеству встроенных обработчиков событий.