Как добавить jQuery на HTML-страницу?

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

$('input[type=radio]').change(function() {

$('input[type=radio]').each(function(index) {
  $(this).closest('tr').removeClass('selected');
});

$(this).closest('tr').addClass('selected');
});

Ответы

Ответ 1

Включение библиотеки jQuery

Это код jQuery. Сначала вам нужно убедиться, что загружена библиотека jQuery. Если вы не размещаете файл библиотеки самостоятельно, вы можете связать его с jQuery CDN:

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

Вы можете сделать это в разделе <head>, но это прекрасно, пока он загружается перед вашим кодом jQuery.

Дальнейшее чтение:

Размещение кода на странице

Поместите свой код в теги <script>. Его можно вставлять в любом месте <head> или <body>. Если вы поместите его перед тегами <input> и <tr> (как указано в вашем коде), вы должны использовать $(document).ready(), чтобы убедиться, что эти элементы присутствуют до запуска кода:

$(document).ready(function() {
    // put your jQuery code here.
});

Если вы хотите, чтобы содержимое вашей страницы было загружено как можно скорее, вы можете поместить его как можно ближе к тегу </body> close. Но другая распространенная практика - разместить весь код JavaScript в разделе <head>. Это ваш выбор, основываясь на вашем стиле кодирования и потребностях.

Предложение. Вместо того, чтобы вставлять код JS/jQuery непосредственно в HTML-страницу, подумайте о размещении кода в отдельном файле .js. Это позволит вам повторно использовать один и тот же код на других страницах:

<script src="/path/to/your/code.js"></script>

Дальнейшее чтение:

Ответ 2

Вам нужно обернуть это в теги script:

<script type='text/javascript'> ... your code ... </script>

Это, как говорится, важно, КОГДА вы выполняете этот код. Если вы поместите это на страницу перед элементами HTML, в которые она подключается, тогда script будет работать до того, как HTML на самом деле будет отображаться на странице, поэтому он будет терпеть неудачу.

Общепринятой практикой является обматывание этого типа кода в блоке "готовый документ", например:

<script type='text/javascript'>
$(document).ready(function() {

... your code...

}}
</script>

Это гарантирует, что вся страница была отображена в браузере ДО того, как ваш код будет выполнен. Также лучше всего поместить код в раздел <head> на странице.

Ответ 3

Внутри тэгов <head></head> добавляется...

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('input[type=radio]').change(function() {

    $('input[type=radio]').each(function(index) {
        $(this).closest('tr').removeClass('selected');
    });

        $(this).closest('tr').addClass('selected');
    });
});
</script>

ИЗМЕНИТЬ: размещение внутри <head></head> не является единственным вариантом... это можно так же легко разместить ПРАВИЛЬНО перед закрывающим тегом </body>. Обычно я пытаюсь разместить свой JavaScript внутри head для причин размещения, но в некоторых случаях может замедлить рендеринг страниц, поэтому некоторые из них рекомендуют последний подход (до закрытия body).

Ответ 4

Вы можете включить JQuery, используя любое из следующих действий:

  • Ссылка Использование jQuery с CDN

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>

  • Загрузите Jquery From Here и включите в свой проект
  • Загрузите последнюю версию, используя эту ссылку

Ваше размещение кода может выглядеть примерно так.

  • Ваш JQuery должен быть включен перед тем, как использовать его в любом месте, где он будет вызывать ошибку.

`` `

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$(document).ready(function(){
    $('input[type=radio]').change(function() {

    $('input[type=radio]').each(function(index) {
        $(this).closest('tr').removeClass('selected');
    });

        $(this).closest('tr').addClass('selected');
    });
});
</script>

`` `

Ответ 5

Включите javascript, используя теги script непосредственно перед тегом body. Желательно, чтобы вы поместили его в отдельный файл и связали с ним, чтобы сделать вещи немного более организованными и более удобными для чтения. Theres простая статья здесь, которая покажет вам, как http://www.selftaughtweb.com/how-to-include-javascript/

Ответ 6

Вам нужен этот обертку кода в тегах и положить конец страницы. Или создайте JS файл (например, test.js), напишите на нем этот код и поместите в конец страницы этот тег