كيفية تنفيذ جافا سكريبت للحصول بدقة على قيمة سمة CSS لعنصر ما؟ عند التعامل مع خصائص CSS لعناصر DOM، غالبًا ما نواجه مشكلة: تم تعريف قيمة خاصية CSS على الصفحة، ولكنها فارغة عند الحصول عليها، وذلك لأن أي ملف ورقة أنماط أو معلومات نمط CSS الافتراضية المضمنة لا يمكن أن تنعكس بشكل موثوق في سمة النمط تقدم لك هذه المقالة طريقة الحصول بدقة على قيمة سمة CSS لعنصر محدد.
جافا سكريبت:
مثال لكود المصدر
[www.downcodes.com] <نوع البرنامج النصي = "نص/جافا سكريبت">
وظيفة getStyle (العنصر، الاسم)
{
// إذا كانت هذه السمة موجودة في النمط []، فقد تم تعيينها مؤخرًا (وهي السمة الحالية)
إذا (elem.style[اسم])
{
إرجاع elem.style[name];
}
// بخلاف ذلك، جرب طريقة IE
وإلا إذا (elem.currentStyle)
{
إرجاع elem.currentStyle[name];
}
// أو طريقة W3C، إذا كانت موجودة
وإلا إذا (document.defaultView && document.defaultView.getComputedStyle)
{
// يستخدم أسلوب كتابة قواعد النمط التقليدي "محاذاة النص" بدلاً من "textAlign"
name = name.replace(/([AZ])/g,"-$1");
name = name.toLowerCase();
// احصل على كائن النمط واحصل على قيمة السمة (إن وجدت)
var s = document.defaultView.getComputedStyle(elem,"");
إرجاع s && s.getPropertyValue(name);
// وإلا فأنت تستخدم متصفحًا آخر
}
آخر
{
عودة فارغة؛
}
}
