آموزش jQuery > سایر متدهای jQuery > متد ( ) data
متد ( ) data در jQuery :
متد ( ) data ، می تواند اطلاعاتی را به یک عنصر مورد نظر اضافه کرده و یا اینکه اطلاعات
آن را خوانده و به صفحه بازگرداند .
نکته : برای حذف اطلاعات اضافه شده از متد
( ) removeData استفاده نمایید .
1 . خواندن و برگرداندن اطلاعات یک عنصر با استفاده از متد ( ) data :
به وسیله متد ( ) data می توانید اطلاعات موجود در یک عنصر HTML را خوانده و به صفحه
بر گردانید .
شکل کلی استفاده از متد ( ) data در این حالت به صورت زیر است :
Syntax
|
$( selector ).data ( name ) ;
|
توضیح هر یک از موارد syntax :
توضیح
|
این پارامتر تعیین کننده id عنصری است که می خواهیم اطلاعات آن را خوانده و به صفحه
بر گردانیم .
|
این پارامتر تعیین کننده نام اطلاعاتی در عنصر مورد نظر است که می خواهید آن را خوانده
و به صفحه بر گردانید .
استفاده از این پارامتر اختیاری است .
|
2 . اضافه کردن اطلاعات به یک عنصر توسط متد ( ) data :
به وسیله متد ( ) data می توان اطلاعات مورد نظر خود را به یک عنصر در صفحه اضافه نمایید
.
شکل کلی استفاده از متد ( ) data در این حالت به صورت زیر است :
Syntax
|
$( selector ).data ( name , value ) ;
|
توضیح هر یک از موارد syntax :
توضیح
|
این پارامتر تعیین کننده id عنصری است که می خواهیم اطلاعات آن را خوانده و به صفحه
بر گردانیم .
|
این پارامتر تعیین کننده نام اطلاعاتی است که می خواهیم به عنصر مورد نظرمان اضافه
نماییم .
استفاده از این پارامتر اجباری است .
|
این پارامتر تعیین کننده اطلاعاتی است که می خواهیم به عنصر مورد نظرمان اضافه نماییم
.
استفاده از این پارامتر اجباری است .
|
مثال : در مثال زیر ابتدا یک اطلاعات با نام greeting و مقدار Hello
World را به عنصر div اضافه کرده ایم . سپس این اطلاعات را خوانده و نمایش داده ایم
:
< html >
< head >
< script type="text/javascript" src="jquery.js"
> < /script >
< script type="text/javascript" >
$ (document). ready ( function(
) {
$("#btn1").click(function(){
$("#div1").data("greeting", "Hello World");
});
$("#btn2").click(function(){
alert($("#div1").data("greeting"));
});
});
</script>
</head>
<body>
<button id="btn1"> div اضافه
کردن اطلاعات به عنصر</button><br>
<button id="btn2"> div خواندن اطلاعات
از عنصر</button>
<div id="div1">
</div>
</body>
</html>
|
|
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نظر خودتان درباره این صفحه را با ما در میان بگذارید :