انیمه
خدمت سربازی
حیوانات خانگی
بازی
فیلم و سریال
موبایل و تبلت
خودرو
برنامه نویسی
نرم افزار
زبان انگلیسی
گرافیک
سخت افزار
گل و گیاه
ارز دیجیتال
کتاب و مجله
گردشگری
ورزش
2
ماجراجوبه دست آوردن مقدار Css با استفاده از جاوا اسکریپت
وقتی به یک المان یک استایل داده شده است و می خواهیم با جاوااسکریپت مقدار آن را بخوانیم از روش زیر می توانیم استفاده کنیم :
<div id="container" style="color:red">
Content
</div>
<script>
alert(container.style.color); // => red
</script>
ولی در صورتی که به جای style از طریق class، رنگ تعریف شده باشد، نتیجه عبارت container.style.color خالی می شود. یعنی:
<style>
.red
{
color:red
}
</style>
<div id="container" class="red">
Content
</div>
<script>
alert(container.style.color); // => خالی
</script>
برای اینکه در این شرایط هم نتیجه درست نمایش داده شود، چه راه حلی وجود داره؟
پاسخ به سوال
1157بازدید
پاسخ ها (1)
2
بهترین پاسخ
Tavana برای اینکار می توانید از متد getComputedStyle استفاده کنید.
var computedStyle = getComputedStyle(container);
alert( computedStyle.color ); // => rgb(255, 0, 0)
این متد مقادیری که به صورت نسبت بیان شده اند مانند font-size:150% یا font-size:2em و ... را معمولا بعد از تبدیل، به صورت px نمایش می دهد.
حتما در صورت نیاز به مقادیری مانند padding و margin از مقادیری مانند paddingLeft ، marginTop و... استفاده کنید و از padding ، margin و.. تنها استفاده نکنید. با وجود اینکه بعضی از مرورگرها این مقادیر را هم نشان می دهند ولی این یک استاندارد نیست.
پاسخ به سوال
این سوال به پاسخ مورد نظر سوال کننده رسیده است
در صورتی که پاسخ بهتری دارید بر روی دکمه زیر کلیک کنید