Metoda querySelector() pobiera z HTML obiekt, który chcemy użyć.
const btn = document.querySelector(".btn-primary");
const li = document.querySelector("ul li");
const module = document.querySelector("#module");
document.getElementById("demo").innerHTML = "Hello World";
Przykład obsługi zdarzenia onclick
<button onclick="myFunction()">Click me</button>
Kod HTML
Przykład obsługi w skrypcie
<!DOCTYPE html>
<html>
<body>
<h1>HTML DOM Events</h1>
<h2>The onclick Event</h2>
<p>The onclick event triggers a function when an element is clicked on.</p>
<p>Click to trigger a function that will output "Hello World":</p>
<button onclick="myFunction()">Click me</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
</script>
</body>
</html>- onAbort – wywoływane jest w momencie zaniechania ładowania strony
- onBlur – wywoływany jest kiedy element przestaje być aktywny (traci “focus”)
- obDblClick – zdarzenie podwójnego kliknięcia w obiekt
- onChange – wywoływany jest w momencie gdy obiekt zmieni swoją zawartość
- onClick – zdarzenie kliknięcia elementu
- onError – wywoływany jest kiedy w skrypcie wystąpi błąd
- onFocus – wywoływany jest kiedy element staje sie aktywny (uzyskuje “focus”, przeciwieństwo ‘onBlur’)
- onKeyDown – wywoływany jest w momencie naciśnięcia klawisza klawiatury
- onKeyUp – wywoływany jest w momencie puszczenia klawisza klawiatury
- onLoad – wystepuje po załadowaniu elementu
- onMouseOver – występuje w momencie najechania na element kursorem myszki
- onMouseOut – występuje w momencie opuszczenia przez kursor myszki obiektu
- onSelect – wywoływany jest kiedy zawartość obiektu zostanie zaznaczona
- onSubmit – występuje w momencie zatwierdzenia formularza
- onUnload – wywoływany jest gdy strona zostanie zmieniona (np. kliknięto link i następuje przekierowanie)