Лучшая структура HTML для ссылок Ajax

Question

При использовании javascript для назначения обработчиков onclick тегам HTML <a> у меня возникает особый вопрос, когда речь идет об использовании Ajax - как лучше всего получить URL-адрес для запроса ajax? Должен ли я использовать this.href или кодировать его в самой функции-обработчике?

Рассмотрим следующую ссылку:

<a id="link" href="http://mysite.com/getData.php">Get Data</a>

Затем JavaScript:

document.getElementById('link').onclick = function() { 
   // Send ajax request
}

Мне нравится использовать this.href внутри обработчика, но я беспокоюсь о пользователе, который нажимает на ссылку до того, как domready сработает, и ссылки активируются. Лучше использовать href="javascript:void(0);" в HTML, а затем создать URL в самом обработчике? Таким образом, ссылка ничего не будет делать, если она не активирована. Какова лучшая практика здесь?

Спасибо, Брайан

Answer 1

Подумайте об этом с этой точки зрения: как будет работать ваша архитектура страниц, если не включен JS?

Ваше приложение должно реагировать на ввод данных пользователем при любых обстоятельствах и не должно полагаться на неявные предположения о том, будут ли пользователи иметь браузеры с поддержкой Javascript. Звучит смешно, правда? Ну, у меня есть много клиентов, которые работают в огромном корпусе, где все конфиги рабочего стола заблокированы, поэтому все используют IE6 с невероятно строгими настройками.

Следовательно, атрибут href вашего тега привязки должен указывать на местоположение, куда вы хотите, чтобы пользователи заходили, если у них не включен Javascript (у вас должен быть запасной вариант для вашей функциональности AJAX, которая в основном будет делать то же самое вещь). В вашем обработчике onclick вы должны указать URI для вызова AJAX.

Когда все будет сказано и сделано, пользователи, у которых включен JS (а это будет большинство), попадут в ваш обработчик onclick, в котором у вас есть URI для вашего вызова AJAX XHR, и пользователи, у которых не включен JS, будут перенаправлены на другую страницу, которая достигает эквивалентного результата.