JQuery не работает должным образом?

У меня возникли проблемы с jquery.
В конце моей страницы, перед закрытием </body> тега, я включил Jquery CDN:JQuery не работает должным образом?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

Затем в верхней части, в <head>, я включил свой собственный маленький код:

<script> 
     $(document).ready(function() { 
      $('#liked').click(function() { 
       $('#changed').addClass('likeClicked'); 
      }); 
     }); 
</script>

Это влияет на следующее:

<button id='changed' class="like"> 
    <span class="glyphicon glyphicon-heart" id='liked' style="font-size:2.0em;"></span> 
</button>

Однако код не работает. (CSS ниже). Я попытался изменить jquery на зависание, а не на клик, на разные классы или элементы вместо id. Я не знаю, что я делаю неправильно. Любая идея? Благодарю.

.like { 
-webkit-appearance: none; 
outline: none; 
border: 0; 
background: transparent; 
-webkit-transition-duration: 0.2s; 
-moz-transition-duration: 0.2s; 
transition-duration: 0.2s; 
-webkit-user-select: none; 
-moz-user-select: none; 
-ms-user-select: none; 
user-select: none; 
} 

.likeClicked { 
color: #00bc0e; 
}

источник

2016-02-08 J. Gal

любой выход на консоль? – migg

'jquery.min.js' должен появиться перед вашим блоком скрипта. – Jasen

Поместите CDN в тег HEAD, а не в конец страницы. – Baro

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

Если вы посмотрите на консоль своего браузера, в настоящее время вы увидите ошибку $ is not defined. Это остановит все дальнейшее выполнение сценария на странице

источник

2016-02-08 19:06:50 charlietfl

Должно быть, я потратил часы на это. Большое вам спасибо, это сработало, быстрый вопрос, есть ли недостаток в добавлении jquery cdn в голове, а не в нижней части страницы? Я помню, что узнал, что некоторое время назад это ускорило время загрузки. –

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

«Это остановит все последующее выполнение скрипта на странице» - только в этом элементе скрипта. – Quentin

JQuery не работает должным образом?

ответ

Смежные вопросы