با سلام به شمادوستای عزیز وخوب ف امیدوارم که روز خوبی را تا بهاینجا سپری کرده باشید و از اموزشهایس ما تا به اینجا رضایت داشته باشید. دراین مبحث خواندن وتنظیمات محتویات سند می پردازیم.
Existing text: دوره آموزش JQuery. New text: A dynamically set text (#2)
Existing text: کلیه حقوق مادی و معنوی این مقاله متعلق به آموزشگاه تحلیل داده می باشد و هر گونه استفاده غیر قانونی از آن پیگرد قانونی دارد.. New text: A dynamically set text (#3)
Existing text: خواندن (get) و تنظیم کردن (Set) محتویات سند text()]، html() ، [val(). New text: A dynamically set text (#4)
Existing text: آسان ترین کار ممکن در دستکاری DOM، بازیابی و تنظیم متن (text)، مقادیر (value) و HTML یک صفحه می باشد. این سه آیتم اگرچه در نگاه اول مشابه به نظر می رسد، اما در حقیقت تفاوت هایی با هم دارند. Text نمایش متنی محتویات درونی المان های معمولی در نظر گرفته می شود، مقادیر مربوط به المان های فرم هستند که به سرور ارسال می گردند و HTML نیز در واقع همان text است، با این تفاوت که تمامی تگ ها (markup) را شامل می شود.. New text: A dynamically set text (#5)
Existing text: خوشبختانه، برای هر یک از آیتم های ذکر شده، جی کوئری یک متد ویژه ارائه می کند که هم property ها را بازیابی می کند و هم مقادیر آن ها را تنظیم می نماید. این سه متد عبارتند از: text()،html() و. val() در مثال زیر تفاوت میان این سه متد و نیز سهولت در استفاده از آن ها به نمایش گذاشته شده است: . New text: A dynamically set text (#6)
Existing text: . New text: A dynamically set text (#7)
نمونه یک
?
۱
۲
۳
۴
۵
۶
۷
۸
۹
۱۰
$(function () {
alert(“Text: ” + $(“#divTest”).text());
alert(“HTML: ” + $(“#divTest”).html());
alert(“Value: ” + $(“#divTest”).val());
alert(“Text: ” + $(“#txtTest”).text());
alert(“HTML: ” + $(“#txtTest”).html());
alert(“Value: ” + $(“#txtTest”).val());
});
Existing text: . New text: A dynamically set text (#8)
Existing text: فراخوانی یکی از متدها بدون اینکه پارامتری به آن ها ارسال شود، صرفا property مد نظر را برمی گرداند. اگر بخواهیم مقدار property را تنظیم کنیم، بایستی به هر یک از این متدها یک پارامتر پاس دهیم، مانند نمونه ی زیر: . New text: A dynamically set text (#9)
Existing text: . New text: A dynamically set text (#10)
نمونه دو
?
۱
۲
۳
۴
۵
۶
۷
$(function () {
$(“#divText”).text(“A dynamically set text”);
$(“#divHtml”).html(“A dynamically set HTML string“);
$(“#txtTest”).val(“A dynamically set value”);
});
Existing text: . New text: A dynamically set text (#11)
Existing text: . New text: A dynamically set text (#12)
Existing text: می توان با ارسال یک پارامتر اضافی به هر یک از سه متد ذکر شده، آن ها را overload کرد. برای این منظور یک تابع callback به عنوان اولین و تنها پارامتر پاس می دهیم. توابع ذکر شده خود دارای دو پارامتر ورودی به شرح زیر می باشد پارامتر اول بیان کننده ی اندیس اولین المان در لیست المان های انتخاب شده می باشد.و پارامتر دوم بیان کننده مقدار که درون المان انتخاب شده می باشد و شما می توانید به عنوان خروجی تابع یک رشته را برگردانید که در پایین از تلفیق دو رشته جدید و قدیم این خروجی را تولید کرده ایم:. New text: A dynamically set text (#13)
Existing text: . New text: A dynamically set text (#14)
نمونه سه
?
۱
۲
۳
۴
۵
۶
۷
$(function () {
$(“p”).text(function (index, oldText) {
return “Existing text: ” + oldText + “. New text: A dynamically set text (#” + index + “)”;
});
});
Existing text: . New text: A dynamically set text (#15)
Existing text: . New text: A dynamically set text (#16)
Existing text: با سه المان p مثال را شروع می کنیم که تنها تفاوت آن ها در نوشته ای (text) است که نمایش می دهند. سپس هر سه المان مزبور را در کد jQuery انتخاب کرده و نسخه ی overload شده ی متد text() را برای جایگزین کردن نوشته ی کنونی با متن جدید (با استفاده از دو پارامتر ورودی که به تابع نام برده پاس می دهیم) بکار می بریم. این پارامترها عبارتند از: ۱٫ اندیس یا شماره ی مکان قرار گیری المان جاری و ۲٫ محتوای المان p (text جاری). این نوشته ی جدید به عنوان خروجی به jQuery بازگردانده می شود که متن جاری را با متن جدید جایگزین می کند. . New text: A dynamically set text (#17)
