Проблема здесь в том, что при запуске ваш код, нет DOM элемент с ID klik. Таким образом, ваш код, связанный с обработчиком событий, ничего не делает.
Если вы просто переместить элемент scriptпод где вы определяете, что элемент (и под которой вы включаете JQuery, так как вы полагаетесь на JQuery загружаемой), он будет работать:
<html>
<head>
</head>
<body>
<button id="klik">Click me!</button>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
// Since this doesn't run until the element exists, it works
$('#klik').click(function() {
$('#klik').text('test');
});
</script>
</body>
</html>
Поочередно , если вы предпочитаете, вы можете использовать ready событие, которое не стрелял, пока все DOM элементов в HTML не были созданы:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() { // <== This sets up a handler for the `ready` event
// Since this doesn't run until the `ready` fires, the element exists, and it works
$('#klik').click(function() {
$('#klik').text('test');
});
});
</script>
</head>
<body>
<button id="klik">Click me!</button>
</body>
</html>
Запрет действительно хороший причина использовать ready, лучше всего положить script в конце body, непосредственно перед закрывающим тегом </body>, так что это после всех элементов, на которых вы можете работать (и не замедляет воспринимаемую загрузку вашей страницы).
Ссылки:
В комментарии к удаленному ответу вы спросили: «Почему onload требуется, когда мне нужно, чтобы событие срабатывало при нажатии кнопки?» Проблема заключается не в клике, а в * подключении * к элементу. Когда вы делаете '$ (" # klik "). Click (...);', первая часть - '$ (" # klik ")' - просматривает элемент с этим идентификатором в DOM. Но поскольку ваш скрипт * до * вы определяете этот элемент, он еще не существует, поэтому обработчик не привязан ни к чему, и поэтому код в нем никогда не запускается. Если вы просто переместите свой код * после *, вы определили элемент (моя рекомендация) или или используете 'ready' (Neal's), он существует. –