Jquery دارای متدهای پر قدرتی برای مدیریت و دستکاری کردن محتوای تگ های html و ویژگیها و صفات آنهاست .

یکی از قسمت های مهم jquery مدیریت کردن اشیای dom است .

Dom = document object method

مدل dom روش دسترسی صحیح به تگ های html و ویژگیهای انها را مشخص می کند

سه تا از متدهای ساده اما بسیار مفید jquery برای دستکاری کردن عناصر html  عبارت اند از :

           متد text()

این متد متن عنصر انتخاب شده را تنظیم کرده یا بر می گرداند

   متد html()

محتوای عناصر انتخاب شده را تنظیم کرده یا باز می گرداند البته تگ های html بکار رفته درون متن را نیز نمایش می دهد .

  متد val()

مقدار فیلدهای فرم زا تنظیم کرده یا بر می گرداند

روش استفاده :

$(نام ای دی تگ مورد نظر"").text()

$(نام ای دی تگ مورد نظر"").html()

 $("نام ای دی تگ مورد نظر").val()

 

مثال زیر روش دریافت محتوای تگ خاصی را توسط متدهای text  و html نشان می دهد :

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

خط اول :

     هرگاه روی تگی که ای دی آن btn1 است کلیک شد

خط دوم :

     کادر پیامی نشان داده شود که این کادر پیام عبارت text: را به همراه محتوای متنی موجود در تگی که ای دی آن test است نمایش می دهد .

خط چهارم :

     هرگاه روی تگی که از ای دی btn2 استفاده می کند کلیک شد

خط پنجم :

     توسط کادر پیام ، محتوای تگی که از ای دی btn2 استفاده می کند توسط کادر پیام نمایش داده شود که توسط کادر پیام فقط می توان محتوای متنی را نمایش داد .

 

حال مثال بالا را درون یک برنامه کامل html  ببینید :

تذکر : برای عدم اجرا شدن این برنامه در این وبلاگ قبل و بعد از علامت شروع تگها کاراکتر ستاره قرار گرفته است

 

 

مشاهده و اجرای برنامه کامل

 

خروجی توسط متد text :

This is some bold text in a paragraph

خروجی توسط متد html  :

This is some <b>bold</b> text in a paragraph.

 

مثال زیر نشان می دهد که چگونه می توان توسط متد val() محتوای یک فیلد فرم را دریافت نمود :

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

دستورات بالا را درون برنامه کامل html  مشاهده نمائید :

مشاهده و اجرای برنامه کامل