Помогите понять код

[bgraf]

Здравствуйте!

Помогите понять код пожалуйста.

Код взят с сайта, название не буду говорить да бы не делать рекламу ;-), в браузере chrome изучал код страницы и набрел вот на это:

<div id="avatar_container">
<span class="project_tools_del del_avatar">

<a href="#">Удалить</a></span>
<div class="top_block"></div>
<div class="avatar">
<img src="/uploads/public/user/4/39023/180x180crop_1366100577_avatar_4_objects_menedzher_39023.jpg">
</div>
</div>

при нажатии на Удалить аватарка исчезает при этом страница не перезагружается.

Объясните, что происходит? Где вызывается функция которая закрывает аватарку?

[br3t]

Видимо, в js. Вы его нистрочки не привели

[deadrash]

В js привязано событие на клик мыши, js слушает событие, и при нажатии выполняет некоторые действия.

[wwt]

Просто сам тег А не имеет ни класса ни id и обработчик события onclick() привязан с помощью селекторов родительского элемента, то есть к примеру так если используется jQuery:

$(".project_tools_del.del_avatar a").click(function(){
alert("вы кликнули по ссылке");
});

Edited April 16, 2013 by wwt

[bgraf]

Просто сам тег А не имеет ни класса ни id и обработчик события onclick() привязан с помощью селекторов родительского элемента, то есть к примеру так если используется jQuery:

$(".project_tools_del.del_avatar a").click(function(){
alert("вы кликнули по ссылке");
});

а если не jQuery ???

В js привязано событие на клик мыши, js слушает событие, и при нажатии выполняет некоторые действия.

так вот мне и не понятно как привязать событие?

вернее нет <a href="#" onclick="do_something()" > это я могу понять, а вот как в примере и без jquary не понятно

Edited April 16, 2013 by bgraf

[Zippovich]

без jQuery намучаетесь:

1. например ксли хотите что бы все работало в старых браузерах, то кроссброузерная реализация навешивания евента такая:

http://javascript.ru...ons#10-addevent

2. Так же если хотите выбрать по классу, то в html5 без проблем, но если хотите старые браузеры, то тут вот такая примерно простыня:

http://javascript.ru...elementsbyclass

а Вам еще childNode нужно выбрать

В общем, Вам лучше jQuery

Я еще не говорю о том что Вам может понадобиться onReady, который тоже на нативном js представляет собой большую простыню.

Edited April 16, 2013 by Zippovich

[bgraf]

без jQuery намучаетесь:

1. например ксли хотите что бы все работало в старых браузерах, то кроссброузерная реализация навешивания евента такая:

http://javascript.ru...ons#10-addevent

2. Так же если хотите выбрать по классу, то в html5 без проблем, но если хотите старые браузеры, то тут вот такая примерно простыня:

http://javascript.ru...elementsbyclass

а Вам еще childNode нужно выбрать

В общем, Вам лучше jQuery

Я еще не говорю о том что Вам может понадобиться onReady, который тоже на нативном js представляет собой большую простыню.

Подскажите ссылку на стоящий пример с JQuery пожалуйста

[wwt]

без jQuery намучаетесь:

1. например ксли хотите что бы все работало в старых браузерах, то кроссброузерная реализация навешивания евента такая:

http://javascript.ru...ons#10-addevent

2. Так же если хотите выбрать по классу, то в html5 без проблем, но если хотите старые браузеры, то тут вот такая примерно простыня:

http://javascript.ru...elementsbyclass

а Вам еще childNode нужно выбрать

В общем, Вам лучше jQuery

Я еще не говорю о том что Вам может понадобиться onReady, который тоже на нативном js представляет собой большую простыню.

Подскажите ссылку на стоящий пример с JQuery пожалуйста

Откройте примеры на официальном сайте. там достаточно информации.

Но я бы на вашем месте для начала разобрался с html , DOM и как javascript с ним контактируют. Во всяком случае вас перестанут минусовать за вопросы до которых вы еще не доросли.

Edited April 16, 2013 by wwt