jQuery ਸਮੱਗਰੀ ਅਤੇ ਪੈਰਾਮੀਟਰ ਸੈਟ ਕਰਨਾ

ਸਮੱਗਰੀ ਸੈਟ ਕਰਨਾ - text()、html() ਅਤੇ val()

ਅਸੀਂ ਪਿਛਲੇ ਖੰਡ ਵਿੱਚ ਦੇਸ਼ ਵਾਲੇ ਤਿੰਨ ਸਾਮਾਨ ਮੇਥਡਾਂ ਨੂੰ ਵਰਤਾਂਗੇ ਕਿਉਂਕਿ ਸਮੱਗਰੀ ਨੂੰ ਸੈਟ ਕਰਨਾ ਹੈ:

  • text() - ਚੁਣੇ ਹੋਏ ਐਲੀਮੈਂਟ ਦੇ ਟੈਕਸਟ ਸਮੱਗਰੀ ਨੂੰ ਸੈਟ ਕਰਨਾ ਜਾਂ ਵਾਪਸ ਕਰਨਾ
  • html() - ਚੁਣੇ ਹੋਏ ਐਲੀਮੈਂਟ ਦੇ ਸਮੱਗਰੀ ਨੂੰ ਸੈਟ ਕਰਨਾ ਜਾਂ ਵਾਪਸ ਕਰਨਾ (ਹਾਲ ਹੀ ਦੇ ਹੋਰ ਹੈਡਰਾਂ ਸਮੇਤ)
  • val() - ਫਾਰਮ ਫੀਲਡ ਦਾ ਮੁੱਲ ਸੈਟ ਕਰਨਾ ਜਾਂ ਵਾਪਸ ਕਰਨਾ

ਹੇਠ ਦਾ ਉਦਾਹਰਣ ਦਿਸ਼ਾ ਦਿੰਦਾ ਹੈ ਕਿ ਕਿਵੇਂ text()、html() ਅਤੇ val() ਮੇਥਡ ਰਾਹੀਂ ਸਮੱਗਰੀ ਨੂੰ ਸੈਟ ਕਰਨਾ ਹੈ:

ਉਦਾਹਰਣ

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

ਸਵੈ ਮੁੱਖ ਪ੍ਰਯੋਗ ਕਰੋ

text()、html() ਅਤੇ val() ਦੇ ਰਿਟਰਨ ਫੰਕਸ਼ਨ

ਤਿੰਨ ਜਿਊਐਲਸਕਿਪਟ ਮੇਥਡ: text()、html() ਅਤੇ val() ਵੀ ਰਿਟਰਨ ਫੰਕਸ਼ਨ ਰੱਖਦੇ ਹਨ। ਰਿਟਰਨ ਫੰਕਸ਼ਨ ਦੋ ਪੈਰਾਮੀਟਰਾਂ ਨਾਲ ਹੈ: ਚੁਣੇ ਹੋਏ ਐਲੀਮੈਂਟ ਸੂਚੀ ਵਿੱਚ ਮੌਜੂਦਾ ਐਲੀਮੈਂਟ ਦਾ ਸਿਫ਼ਰਾ, ਅਤੇ ਮੂਲ (ਪੁਰਾਣਾ) ਮੁੱਲ। ਫਿਰ ਤੁਸੀਂ ਚਾਹੁੰਦੇ ਹੋਏ ਸਟਰਿੰਗ ਦੇ ਨਵੇਂ ਮੁੱਲ ਨੂੰ ਫੰਕਸ਼ਨ ਵਿੱਚ ਲੈ ਆਓ。

ਹੇਠ ਲਿਖੇ ਉਦਾਹਰਣ ਵਿੱਚ text() ਅਤੇ html() ਦੇ ਕਾਲਬੈਕ ਫੰਕਸ਼ਨ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕੀਤਾ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

$("#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 + ")";
  });
});

ਸਵੈ ਮੁੱਖ ਪ੍ਰਯੋਗ ਕਰੋ

ਪਰਿਭਾਸ਼ਾ ਸੈਟ - attr()

jQuery attr() ਮੈਥਡ ਨੂੰ ਪਰਿਭਾਸ਼ਾ ਮੁੱਲ ਸੈਟ ਕਰਨ ਅਤੇ ਬਦਲਣ ਦੀ ਵਰਤੋਂ ਕੀਤੀ ਜਾਂਦੀ ਹੈ。

ਹੇਠ ਲਿਖੇ ਉਦਾਹਰਣ ਵਿੱਚ ਲਿੰਕ ਵਿੱਚ href ਪਰਿਭਾਸ਼ਾ ਦੇ ਮੁੱਲ ਦੇ ਬਦਲਣ (ਸੈਟ) ਕਰਨ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕੀਤਾ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

$("button").click(function(){
  $("#w3s").attr("href","http://www.codew3c.com/jquery");
});

ਸਵੈ ਮੁੱਖ ਪ੍ਰਯੋਗ ਕਰੋ

attr() ਮੈਥਡ ਨੂੰ ਕਈ ਪਰਿਭਾਸ਼ਾਵਾਂ ਦੀ ਸਾਥ-ਸਾਥ ਸੈਟਿੰਗ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ。

ਹੇਠ ਲਿਖੇ ਉਦਾਹਰਣ ਵਿੱਚ href ਅਤੇ title ਪਰਿਭਾਸ਼ਾ ਦੀ ਸਾਥ-ਸਾਥ ਸੈਟਿੰਗ ਕਰਨ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕੀਤਾ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

$("button").click(function(){
  $("#w3s").attr({
    "href" : "http://www.codew3c.com/jquery",
    "title" : "CodeW3C.com jQuery Tutorial"
  });
});

ਸਵੈ ਮੁੱਖ ਪ੍ਰਯੋਗ ਕਰੋ

attr() ਦੇ ਕਾਲਬੈਕ ਫੰਕਸ਼ਨ

jQuery ਮੈਥਡ attr() ਨੂੰ ਕਾਲਬੈਕ ਫੰਕਸ਼ਨ ਵੀ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ। ਕਾਲਬੈਕ ਫੰਕਸ਼ਨ ਦੋ ਪੈਰਾਮੀਟਰ: ਚੁਣੇ ਹੋਏ ਤੱਤ ਸੂਚੀ ਵਿੱਚ ਮੌਜੂਦ ਤੱਤ ਦਾ ਸਿਰਲੇਖ ਅਤੇ ਪ੍ਰਾਚੀਨ (ਪੁਰਾਣਾ) ਮੁੱਲ ਹੁੰਦੇ ਹਨ। ਫਿਰ ਤੁਸੀਂ ਫੰਕਸ਼ਨ ਦੇ ਨਵੇਂ ਮੁੱਲ ਵਾਲੀ ਕ੍ਰਮਵਾਰ ਚਰਚਾ ਕਰੋ ਜੋ ਤੁਸੀਂ ਵਰਤਣਾ ਚਾਹੁੰਦੇ ਹੋ。

ਹੇਠ ਲਿਖੇ ਉਦਾਹਰਣ ਵਿੱਚ attr() ਮੈਥਡ ਦੇ ਕਾਲਬੈਕ ਫੰਕਸ਼ਨ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕੀਤਾ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

$("button").click(function(){
  $("#w3s").attr("href", function(i,origValue){
    return origValue + "/jquery";
  });
});

ਸਵੈ ਮੁੱਖ ਪ੍ਰਯੋਗ ਕਰੋ

jQuery HTML ਸੰਦਰਭ ਮੈਨੂਅਲ

ਜੇਕਰ ਤੁਸੀਂ jQuery HTML ਮੈਥਡ ਦੀ ਪੂਰੀ ਸਮੱਗਰੀ ਦੀ ਜਾਣਕਾਰੀ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਹੇਠ ਲਿਖੇ ਸੰਦਰਭ ਮੈਨੂਅਲ ਦੀ ਯਾਤਰਾ ਕਰੋ: