jQuery – Získejte obsah a atributy


jQuery obsahuje výkonné metody pro změnu a manipulaci s prvky a atributy HTML.


jQuery DOM manipulace

Jednou velmi důležitou součástí jQuery je možnost manipulovat s DOM.

jQuery přichází s řadou metod souvisejících s DOM, které usnadňují přístup a manipulaci s prvky a atributy.

DOM = Document Object Model

DOM definuje standard pro přístup k HTML a XML dokumentům:

„W3C Document Object Model (DOM) je platforma a jazykově neutrální rozhraní, které umožňuje programům a skriptům dynamicky přistupovat a aktualizovat obsah, strukturu a styl dokumentu."


Získat obsah – text(), html() a val()

Tři jednoduché, ale užitečné metody jQuery pro manipulaci s DOM jsou:

  • text()- Nastaví nebo vrátí textový obsah vybraných prvků
  • html()- Nastaví nebo vrátí obsah vybraných prvků (včetně značek HTML)
  • val()- Nastavuje nebo vrací hodnotu polí formuláře

Následující příklad ukazuje, jak získat obsah pomocí jQuery text()a html()metod:

Příklad

$("#btn1").click(function(){
  alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
  alert("HTML: " + $("#test").html());
});

Následující příklad ukazuje, jak získat hodnotu vstupního pole pomocí val()metody jQuery:

Příklad

$("#btn1").click(function(){
  alert("Value: " + $("#test").val());
});


Získat atributy - attr()

attr()K získání hodnot atributů se používá metoda jQuery .

Následující příklad ukazuje, jak získat hodnotu atributu href v odkazu:

Příklad

$("button").click(function(){
  alert($("#w3s").attr("href"));
});

Další kapitola vysvětluje, jak nastavit (změnit) obsah a hodnoty atributů.


Cvičení jQuery

Otestujte se pomocí cvičení

Cvičení:

Pomocí metody jQuery vrátíte textový obsah prvku <div>.

$("div").();


HTML reference jQuery

Úplný přehled všech metod jQuery HTML naleznete v naší jQuery HTML/CSS Reference .