کاربرد jQuery در HTML - متد ( ) css
متد ( ) css در jQuery :
متد css در jQuery می تواند یک یا چند خاصیت css یک عنصر HTML موجود در صفحه را برگردانده
و یا به مقدار دلخواه تغییر دهد .
به عبارت دیگر شما به وسیله این متد می توانید به مقدار خواص css یک عنصر مورد نظر
دسترسی داشته و یا آن خواص را به مقدار دلخواه تغییر دهید .
برای مثال می توانید به مقدار خاصیت رنگ نوشته یک پاراگراف ( خاصیت Color ) دسترسی
داشته و یا آن را به یک مقدار دلخواه تغییر دهید .
این متد در 3 حالت می تواند مورد استفاده قرار گیرد . در ادامه به تشریح این 3 حالت
خواهیم پرداخت .
حالت 1 : دسترسی به مقدار خاصیت css یک عنصر :
در حالت اول شما می توانید به مقدار یک خاصیت css عنصر مورد نظرتان دسترسی داشته و
مقدار آن را به صفحه برگردانید .
شکل کلی استفاده از متد css در حالت اول به صورت زیر است :
|
Syntax
|
$ ( " selector " ).css ( property ) ;
|
توضیح هر یک از موارد syntax :
|
توضیح
|
|
عنصر مورد نظری است که می خواهید محتویات مقدار یک خاصیت CSS آن را خوانده و یا به
مقدار دلخواه تغییر دهید .
|
|
این پارامتر تعیین کننده خاصیت css عنصری است که می خواهید مقدار آن را خوانده و یا
به یک مقدار جدید تغییر دهید .
|
نکته مهم : در هنگام استفاده از حالت خواندن مقدار خواص css یک عنصر توسط متد css :
در زمانی که شما می خواهید مقدار خاصیت css یک عنصر HTML را بخوانید ، این متد مقدار
آن خاصیت را برای اولین عنصری از نوع تعیین شده که در صفحه پیدا کند ، بر می گرداند
.
مثلا اگر بخواهید رنگ متن یک پاراگراف را در صفحه بخوانید ، این متد رنگ اولین پاراگراف
موجود در صفحه را بر می گرداند . مگر دقیقا در دستور خود ، id پاراگراف مورد نظر را
تعیین نمایید .
مثال : در مثال زیر ، رنگ پاراگراف موجود در مثال ، که خاصیت
color آن می باشد را به وسیله متد css خوانده و در خروجی نمایش داده ایم :
<p id="p_1" style="color: Green">
!! رنگ این پاراگراف در خروجی نوشته شده ، آیا درست است ؟
</p>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
document.getElementById("p_2").innerHTML = "Color :
" + ($("#p_1").css("color"));
});
</script>
<p id="p_2"> </p>
|
|
!! رنگ این پاراگراف در خروجی نوشته شده ، آیا درست است ؟
|
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نظر خودتان درباره این صفحه را با ما در میان بگذارید :