کاربرد jQuery در HTML - متد ( ) css

متد ( ) css در jQuery :

متد css در jQuery می تواند یک یا چند خاصیت css یک عنصر HTML موجود در صفحه را برگردانده و یا به مقدار دلخواه تغییر دهد .
به عبارت دیگر شما به وسیله این متد می توانید به مقدار خواص css یک عنصر مورد نظر دسترسی داشته و یا آن خواص را به مقدار دلخواه تغییر دهید .
برای مثال می توانید به مقدار خاصیت رنگ نوشته یک پاراگراف ( خاصیت Color ) دسترسی داشته و یا آن را به یک مقدار دلخواه تغییر دهید .
این متد در 3 حالت می تواند مورد استفاده قرار گیرد . در ادامه به تشریح این 3 حالت خواهیم پرداخت .

حالت 1 : دسترسی به مقدار خاصیت css یک عنصر :

در حالت اول شما می توانید به مقدار یک خاصیت css عنصر مورد نظرتان دسترسی داشته و مقدار آن را به صفحه برگردانید .
شکل کلی استفاده از متد css در حالت اول به صورت زیر است :

Syntax $ ( " selector " ).css ( property ) ;

توضیح هر یک از موارد syntax :

syntax توضیح
توضیح Parameter
عنصر مورد نظری است که می خواهید محتویات مقدار یک خاصیت CSS آن را خوانده و یا به مقدار دلخواه تغییر دهید . selector
این پارامتر تعیین کننده خاصیت css عنصری است که می خواهید مقدار آن را خوانده و یا به یک مقدار جدید تغییر دهید . property

نکته مهم : در هنگام استفاده از حالت خواندن مقدار خواص css یک عنصر توسط متد css :

در زمانی که شما می خواهید مقدار خاصیت css یک عنصر HTML را بخوانید ، این متد مقدار آن خاصیت را برای اولین عنصری از نوع تعیین شده که در صفحه پیدا کند ، بر می گرداند .
مثلا اگر بخواهید رنگ متن یک پاراگراف را در صفحه بخوانید ، این متد رنگ اولین پاراگراف موجود در صفحه را بر می گرداند . مگر دقیقا در دستور خود ، id پاراگراف مورد نظر را تعیین نمایید .

مثال : در مثال زیر ، رنگ پاراگراف موجود در مثال ، که خاصیت color آن می باشد را به وسیله متد css خوانده و در خروجی نمایش داده ایم :

Example
<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>
کد

!! رنگ این پاراگراف در خروجی نوشته شده ، آیا درست است ؟



راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نظر خودتان درباره این صفحه را با ما در میان بگذارید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :  
 
سوال امنیتی : جمع سه + پنج چنده ؟