Ultimele tutoriale de dezvoltare web
 

jQuery - Set de conținut și atribute


Set de conținut - text(), html() , și val()

Vom folosi aceleași trei metode din pagina anterioară pentru a set content :

  • text() - Setează sau returnează conținutul text al elementelor selectate
  • html() - Setează sau returnează conținutul elementelor selectate (inclusiv elementele de limbaj HTML)
  • val() - Setează sau returnează valoarea câmpurilor de formular

Următorul exemplu demonstrează cum să setați conținut cu jQuery text(), html() , și val() metode:

Exemplu

$("#btn1").click(function(){
    $("#test1").text("Hello world!");
});
$("#btn2").click(function(){
    $("#test2").html("<b>Hello world!</b>");
});
$("#btn3").click(function(){
    $("#test3").val("Dolly Duck");
});
Încearcă - l singur »

O funcție callback pentru text(), html() , și val()

Toate cele trei metode de mai sus jQuery: text(), html() , și val() , de asemenea , vin cu o funcție de apel invers. Funcția de apel invers are doi parametri: indicele elementului curent în lista elementelor selectate și original (old) valoarea. Apoi vă întoarceți șirul pe care doriți să îl utilizați ca noua valoare din funcția.

Următorul exemplu demonstrează text() si html() cu o funcție de apelare inversă:

Exemplu

$("#btn1").click(function(){
    $("#test1").text(function(i, origText){
        return "Old text: " + origText + " New text: Hello world!
        (index: " + i + ")";
    });
});

$("#btn2").click(function(){
    $("#test2").html(function(i, origText){
        return "Old html: " + origText + " New html: Hello <b>world!</b>
        (index: " + i + ")";
    });
});
Încearcă - l singur »

Set Atribute - attr()

JQuery attr() Metoda este de asemenea folosit pentru a seta / modifica valorile atributului.

Următorul exemplu demonstrează cum se schimba (set) valoarea href atributului într - un link:

Exemplu

$("button").click(function(){
    $("#w3s").attr("href", "http://www.w3ii.com/jquery");
});
Încearcă - l singur »

attr() metoda , de asemenea , vă permite să setați mai multe atribute simultan.

Următorul exemplu demonstrează cum să setați atât href și titlul atribute în același timp:

Exemplu

$("button").click(function(){
    $("#w3s").attr({
        "href" : "http://www.w3ii.com/jquery",
        "title" : "w3ii jQuery Tutorial"
    });
});
Încearcă - l singur »

O funcție callback pentru attr()

Metoda jQuery attr() , de asemenea , veni cu o funcție de apel invers. Funcția de apel invers are doi parametri: indicele elementului curent în lista elementelor selectate și original (old) valoarea de atribut. Apoi vă întoarceți șirul pe care doriți să îl utilizați ca new valoare atribut din funcția.

Următorul exemplu demonstrează attr() cu o funcție callback:

Exemplu

$("button").click(function(){
    $("#w3s").attr("href", function(i, origValue){
        return origValue + "/jquery";
    });
});
Încearcă - l singur »

Testați-te cu exerciții!

Exercițiul 1 » Exercițiul 2» Exercițiul 3 » Exercițiul 4» Exercițiul 5 »


jQuery HTML de referință

Pentru o prezentare completă a tuturor metodelor jQuery HTML, vă rugăm să accesați pagina jQuery HTML / CSS de referință .