جی کوئی میٹھاں کا استعمال اور اپریشن

محتوا قائم کرنا - text()، html() اور val()

ہم پچھلے باب میں کیئی تین ایک سے مشترک کی تین فنکشنوں کا استعمال کریں گے تاکہ محتوا کو قائم کریں:

  • text() - انتخاب شدہ عنصر کی متن کو قائم یا واپس لایا جاتا ہے
  • html() - انتخاب شدہ عنصر کی محتوا کو قائم یا واپس لایا جاتا ہے (ملکمل 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){
    بازگردان "Old text: " + origText + " New text: Hello world!
    (index: "+ i + ")";
  });
});
$("#btn2").click(function(){
  $("#test2").html(function(i,origText){
    بازگردان "Old html: " + origText + " New html: Hello <b>world!</b>
    (index: "+ i + ")";
  });
});

آزمایش کنید

تنظیم خصیصه - attr()

روش attr() jQuery همچنین برای تنظیم/تغییر مقدار خصیصه‌ها استفاده می‌شود.

در مثال زیر، نحوه‌ی تغییر (تنظیم) مقدار خصیصه 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()

روش attr() jQuery نیز فراخوانی به یک توابع فراهم می‌کند. توابع فراخوانی شامل دو پارامتر است: شماره مرتبه عنصر در لیست انتخاب شده و مقدار اولیه (قدیم). سپس با استفاده از توابع مقدار جدیدی که می‌خواهید استفاده کنید را بازگردانید.

در مثال زیر، روش attr() با فراخوانی به回调 نمایش داده شده است:

مثال

$("button").click(function(){
  $("#w3s").attr("href", function(i,origValue){
    بازگردان origValue + "/jquery";
  });
});

آزمایش کنید

منابع jQuery HTML

برای دسترسی به محتوای کامل روش‌های jQuery HTML، لطفاً به منابع زیر مراجعه کنید: