Правильный способ запуска javascript из html

Question

Каков способ создания графического компонента (точнее, значка twitter.bootstrap) на веб-сайте html, вызывающего java-скрипт.

Можно было либо сделать кнопку, либо поставить на нее значок, но это не выглядит красиво ИМХО. Или можно использовать тег HREF,

<a href="#" name="ad_fav" onclick= CALLFUNCTION> <i 
         class="icon"></i></a> 

Но что является самым чистым способом достижения этой цели? Было бы неплохо, если бы значок мог измениться после его нажатия.

Как это реализовано, например, кнопка upvote в stackoverflow?

Answer 1

Другой способ:

function myFunc() { 
// code here 
} 

var element = document.getElementsByClassName("icon"); 
element[0].addEventListener("click", myFunc); 

Answer 2

Просто сделать HREF в < > быть 'JavaScript:', пример:

<a href="javascript:alert('hello there! this works!')" name="ad_fav"> <i 
        class="icon"></i></a> 

Заменить оповещения (...) с вызовом функции, если вам нужно

Answer 3

Вы не есть ли обернуть его с элементом анкерного:

<img src="[path to twitter.bootstrap icon]" onclick="yourJavaScriptFunction" /> 

Answer 4

Почему бы вам не использовать jquery для функции?

$(document).on("click", "a.icon", function (e) { 
    e.preventDefault(); 
});