Каково различие между различными методами помещения кода JavaScript в <a>?

83
задан Community 23 May 2017 в 11:54
поделиться

5 ответов

Я вполне наслаждаюсь статья Javascript Best Practices Matt Kruse. В нем он заявляет, что с помощью эти href раздел для выполнения кода JavaScript является плохой идеей. Даже при том, что Вы заявили, что Вашим пользователям нужно было включить JavaScript, нет никакой причины, у Вас не может быть простой страницы HTML, на которую могут указать все Ваши ссылки JavaScript для их href раздел, если кто-то, оказывается, выключает JavaScript после входа в систему. Я высоко поощрил бы Вас все еще позволять этот механизм нейтрализации. Что-то вроде этого будет придерживаться "лучших практик" и выполнять Вашу цель:

<a href="javascript_required.html" onclick="doSomething(); return false;">go</a>
67
ответ дан Peter Mortensen 24 November 2019 в 08:58
поделиться

Почему Вы сделали бы это, когда можно использовать addEventListener / attachEvent? Если нет никакого href - эквивалентен, не используйте <a>, используйте <button> и разработайте его соответственно.

10
ответ дан eyelidlessness 24 November 2019 в 08:58
поделиться

Вы забыли другой метод:

5: <a href="#" id="myLink">Link</a>

С кодом JavaScript:

document.getElementById('myLink').onclick = function() {
    // Do stuff.
};

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

4
ответ дан Peter Mortensen 24 November 2019 в 08:58
поделиться
<a href="#" onClick="DoSomething(); return false;">link</a>

я сделаю это, или:

<a href="#" id = "Link">link</a>
(document.getElementById("Link")).onclick = function() {
    DoSomething();
    return false;
};

В зависимости от ситуации. Для объемных приложений второе является лучшим, потому что тогда оно консолидирует Ваш код события.

3
ответ дан Anik Islam Abhi 24 November 2019 в 08:58
поделиться

Метод № 2 имеет синтаксическую ошибку в FF3 и IE7. Я предпочитаю методы № 1 и № 3, потому что № 4, грязный URI с '#' хотя причины меньше ввода... Очевидно, как отмечено другими ответами, лучшим решением является отдельный HTML от обработки событий.

1
ответ дан Pier Luigi 24 November 2019 в 08:58
поделиться
Другие вопросы по тегам:

Похожие вопросы: