بالإضافة إلى تعريف النمط المضمّن (أي المُضاف من خلال سمة النمط)، فإن نمط CSS لعنصر ما له أيضًا طريقتان: css مضمن في الصفحة وcss يتم تقديمه خارجيًا. ومع ذلك، في JS، يمكن الحصول على سمات النمط المضمنة فقط من خلال el.style.xxx، والتي لها قيود كبيرة نسبيًا. ولحسن الحظ، توفر المتصفحات طرقًا أخرى للحصول على سمات النمط المحددة بطرق أخرى في IE، هناك متصفحات currentStyle وFF ومتصفحات w3c القياسية الأخرى مثل getComputedStyle.
لسهولة التشغيل، قامت العديد من ملفات js-libs الحالية بتغليف ذلك، ولكن في كثير من الأحيان لا نحتاج إلى تقديم أي lib. كل ما نحتاجه هو وظيفة getStyle للحصول على تعريف النمط الحالي للعنصر. بعد الرجوع إلى العديد من أكواد JS-Lib، قررت تنفيذ نسخة مبسطة من وظيفة getStyle. الهدف من هذه الوظيفة هو تلبية معظم الاحتياجات، وأن تكون متعددة المتصفحات، وأن تحتوي على تعليمات برمجية موجزة، وأن تتمتع بأداء ممتاز. بناءً على هذه المتطلبات، استغرق الأمر مني ساعة لإنجازها، وقد استخدمت بشكل أساسي العديد من النصائح مثل "خصائص عامل التشغيل المنطقي لـ JS، و"تجميع" التعليمات البرمجية، والتنفيذ الفوري للوظائف. لقد كتبتها هنا للاستخدام المستقبلي. إذا كان الأمر كذلك". يمكن أن تكون مفيدة لأي صديق، بالطبع سيكون من الأفضل.
رمز البرنامج
فار getStyle=function(){
var f=document.defaultView;
إرجاع وظيفة جديدة ('el'،'style'،[
"style.indexOf('-')>-1 && (style=style.replace(/-( \w)/g,function(m,a){return a.toUpperCase()}));",
"style=='float' && (style='",
و؟ "cssFloat": "styleFloat"،
"');return el.style[style] || ",
f ? 'window.getComputedStyle(el, null)[style]' : 'el.currentStyle[style]',
' ||.null;'].join(''));
}();
// مثال الاستخدام:
var el=document.getElementById('test');
getStyle(el,'line-height');
getStyle(el,'color');
getStyle(el,'float');
من: http://www.ajaxbbs.net/post/webFront/JS-Get-Style-Function.html