In acest tutorial puteti invata cum se Adauga, Modifica si Sterge Atribute (precum id, class, href, disabled, etc.) la elemente HTML folosind jQuery.
Toate aceste actiuni pot fi efectuate cu metodele jQuery attr() si removeAttr().

Adaugare atribut

Pentru a adauga un atribut la un element /sau elemente HTML (cum sunt id, class, href, selected, etc.), se aplica aceasta sintaxa:
$('element').attr('nume_atribut', 'valoare');
Exemple:
- Adauga atributul id="valoare" la DIV-ul pe care se apasa clic:
$('div').click(function() { $(this).attr('id', 'valoare'); });

- Adauga atributul disabled la butonul submit cu id="submit1":
$('submit#submit1').attr('disabled', 'disabled');

- Selecteaza ultimul <option> din lista Select cu class="cls" (adaugand "selected" la acea optiune):
$('select.cls option:last).attr('selected', 'selected');

- Adauga class="valoare" la elementele <li> cu ordine para din tag-ul HTML cu id="idtag":
$('#idtag li:even').attr('class', 'valoare');

• Atributul class poate fi adaugat si cu metoda jQuery addClass().
Syntax:
$('element').addClass('nume_atribut', 'valoare');
Exemplu:
- Adauga class "cls" la DIV-ul pe care se apasa clic:
$('div').click(function() { $(this).addClass('cls'); });

• O alta metoda jQuery utila pentru lucru cu atributul class este toggleClass(). Aceasta functie adauga sau sterge clase din elementele selectate. Daca acel tag nu are clasa specificata, o adauga; daca are deja acea clasa, o sterge.
- De exemplu, adauga /sterge clasa "cls" din DIV-ul pe care se apasa clic:
$('div').click(function() { $(this).toggleClass('cls'); });

Modificare valoare atribut

Ca sa modificati valoarea unui atribut, se foloseste tot metoda attr(), cu aceasta sintaxa:
$('element').attr('nume_atribut', 'noua_valoare');
Exemple:
- Modifica imaginea adaugata intr-un tag IMG cu id="img1" (prin schimbarea valorii atributului "src"):
$('img#img1').attr('src', 'alta_poza.jpg');

- Modifica adresa URL a primului link HTML (<a>) din tag-ul cu id="idtag"
$('#idtag a:first').attr('href', 'https://marplo.net');

- Modifica adresa paginii adaugata la action in formularul cu id="frm1":
$('form#frm1').attr('action', 'alt_fisier.php');

Stergere atribute

Ca sa stergeti un atribut din unul sau mai multe elemente HTML se foloseste metoda jQuery removeAttr(), cu aceasta sintaxa:
$('element').removeAttr('nume_atribut');
Exemple:
- Sterge ID-ul din DIV-ul pe care se executa clic:
$('div').click(function() { $(this).removeAttr('id'); });

- Sterge atributul disabled din butonul submit cu id="submit1":
$('submit#submit1').removeAttr('disabled');

- Sterge class la elementele <li> cu ordine para din tag-ul HTML cu id="idtag":
$('#idtag li:even').removeAttr('class');

• Atributul class poate fi sters si cu metoda jQuery removeClass().
De exemplu, sterge atributul class din DIV-ul pe care se apasa clic:
$('div').click(function() { $(this).removeClass(); });
- Daca se specifica un parametru la functia removeClass(), cu valoarea unei clase, va fi stearsa doar acea clasa (folositor cand elementul HTML are mai multe clase), altfel, sterge toate clasele acelui element.

Atributul type, din casetele <input> de formular nu pot fi sterse sau modificate.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce tag se foloseste pentru a adauga liste in elemente <ul> si <ol>?
<dt> <dd> <li>
<ul>
 <li>http://coursesweb.net/html/</li>
 <li>http://www.marplo.net/html/</li>
</ul>
Care valoare a proprietatii "display" seteaza elementul ca tip bloc si afiseaza un punct in fata?
block list-item inline-block
.some_class {
  display: list-item;
}
Care instructiune JavaScript transforma un obiect in sir JSON.
JSON.parse() JSON.stringify eval()
var obj = {
 "courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr);    // {"courses":["php","javascript","ajax"]}
Indicati clasa PHP folosita pentru a lucra cu elemente HTML si XML in PHP.
stdClass PDO DOMDocument
$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>';
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);
$elm = $dochtml->getElementById("dv1");
echo $elm->nodeValue;    // CoursesWeb.net
Indicati forma de Prezent Continuu a verbului "to live" (a trai /a locui)
lived living liveing
I`m living here.
- Traiesc /Locuiesc aici.
Care este forma de Gerunziu (sau Participiu Prezent) a verbului "vivir" (a trai /a locui)?
viviĆ³ vivido viviendo
Estoy viviendo aquĆ­.
- Traiesc /Locuiesc aici.
Adauga, Sterge, Modifica Atribute cu jQuery

Last accessed pages

  1. Scriere cod CSS (740)
  2. Prezentul simplu si continuu - Present Tense Simple and Continuous (19365)
  3. Introducere (412)
  4. Prezentul simplu - Exercitii si teste incepatori (6922)
  5. Gramatica limbii spaniole. Indrumator si prezentare generala (8992)

Popular pages this month

  1. Gramatica limbii engleze - Prezentare Generala (2324)
  2. Cursuri si Tutoriale: Spaniola, Engleza, HTML, CSS, Php-Mysql, JavaScript, Ajax (1197)
  3. Creare si editare pagini HTML (1171)
  4. Curs HTML gratuit Tutoriale HTML5 (982)
  5. Prezentul simplu si continuu - Present Tense Simple and Continuous (886)