Ненавязчивый JavaScript

Материал из Seo Wiki - Поисковая Оптимизация и Программирование

Перейти к: навигация, поиск

Ненавязчивый JavaScript (англ. Unobtrusive JavaScript) является относительно новой техникой в программировании на языке JavaScript, используемой в Вебе. Этот термин был изобретен в 2002 году Стюартом Лэнгриджем.[1] Хотя он официально не определён, под его принципами обычно понимаются следующие:

  • отделение функциональности веб-страницы («уровень поведения») от структуры, содержания и представления Web-страницы;[2]
  • лучшие практики по избежанию проблем традиционного программирования на JavaScript (таких как зависимость от браузера и недостаток маcштабируемости);
  • постоянное совершенствование по поддержке пользовательских агентов, которые могут не в полной мере поддерживать функциональность JavaScript.[3]

Предпосылки появления парадигмы

JavaScript давно имел репутацию языка, непригодного для серьёзного применения и развития. Такая ситуация складывалась в основном из-за несовместимых реализаций языка и Document Object Model в различных браузерах. Недавнее появление стандартизированных браузеров возвело JavaScript в рамки высококачественного средства отладки, в результате стало возможным организовать масштабируемость JavaScript кода, а появление интерфейсов AJAX и Веб 2.0 сделали это необходимым.

Если JavaScript была зарезервирована для относительно простых и важных задач, таких, как форма подтверждения и декоративные новинки, то в настоящее время язык используются для создания основной функциональности сайта. Ненавязчивый JavaScript можно рассматривать как часть более широкого движения веб-стандартов; в основном, поскольку спрос на кросс-совместимость браузера привел к усилению акцента на стандартизированные разметки и стиль, увеличился спрос на Rich Internet Applications, это вызывало движение в направлении более надежных методов в ненавязчивом JavaScript.

Отделение поведения от разметки

Традиционно вызовы функций JavaScript размещались непосредственно в разметке документа. Пример ниже иллюстрирует типичную реализацию валидацию поля формы:

<input type="text" name="date" onchange="validateDate(this);" />

Однако разметка предназначена для описания структуры документа, но не его поведения. Сочетание же этих посылов ведёт к ухудшению поддерживаемости сайта. Происходит это по той же причине, что и смешивание структуры и представления: если сайт содержит сотни полей с датами, добавление соответствующего атрибута onchange к каждому (и модификация их позже в случае необходимости) может оказаться трудоёмкой процедурой. Кроме того, смешивание структуры и поведения ведёт к повышению требований к профессиональным качествам человека, который будет этим заниматься.

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

<input type="text" class="validatedDate" />

Скрипт может просматривать все элементы input, относящиеся к классу validatedDate и устанавливать для них нужный обработчик:

window.onload = function(){
    var inputs = document.getElementsByTagName('input');
    for(var i = 0, l = inputs.length; i<l; i++){ 
        input = inputs[i];
        if(input.name && (input.className.indexOf('validatedDate') > -1) ){ 
            input.onchange = function(){ 
                validateDate();
            };
        }
    }
};
 
function validateDate(){
	// логика обработчика
}

Следующий скрипт специфичен для библиотеки JavaScript jQuery:

$(document).ready(function(){ 
	$('input.validatedDate').bind('change', validateDate);
});
 
function validateDate(){
	// логика обработчика
}

Поскольку атрибут class отражает семантическую роль элемента, такой подход согласуется с рекомендациями W3C, основанными на современных стандартах.

Примечания

  1. Лэнгридж, Стюарт Ненавязчивый DHTML и мощь маркированных списков (2002-11). Проверено 4 июня 2009.(англ.)
  2. Кейт, Джереми Отделение поведения (2006-06-20). Проверено 4 июня 2009.(англ.)
  3. Олсон, Томми Изящная деградация и постоянное совершенствование (2007-02-06). Проверено 4 июня 2009.(англ.)
ar:جافا سكريبت المخفية

en:Unobtrusive JavaScript es:JavaScript no obstructivo fr:Javascript discret

Личные инструменты

Served in 0.142 secs.