ملاحظة: إنه للحصول على النمط ، وليس لضبط النمط. إذا لم يتم تعيين قيمة نمط للعنصر ، فسيتم إرجاع القيمة الافتراضية التي قدمها المتصفح. (تم فرز المنتدى)
1. element.style: لا يمكن الحصول على قيمة النمط المكتوبة في سمة النمط في علامة العنصر. لا يمكن الحصول على سمة النمط المحددة في <style> </style> وتحميلها من خلال <link href = "css.css">.
نسخة الكود كما يلي:
var ele = document.getElementById ('eLe') ؛
ele.style.Color ؛ // احصل على اللون
2. window.getComputedStyle (): يمكنه الحصول على جميع قيم سمة CSS النهائية للعنصر الحالي.
نسخة الكود كما يلي:
window.getComputedStyle ("element" ، "pseudo-class") ؛
تقبل هذه الطريقة معلمتين: للحصول على عنصر النمط المحسوب وسلسلة العناصر الزائفة (على سبيل المثال ": قبل"). إذا لم تكن معلومات العناصر الزائفة مطلوبة ، فيمكن أن تكون المعلمة الثانية خالية. يمكن أيضًا استخدامه عبر document.defaultView.getComputedStyle ("element" ، "pseudo-class") ؛
نسخة الكود كما يلي:
var ele = document.getElementById ('eLe') ؛
var styles = window.getComputedStyle (eLe ، null) ؛
الأنماط. // احصل على اللون
يمكنك استخدام Style.Length لعرض عدد الأنماط الافتراضية للمتصفح. لا يدعم IE6-8 هذه الطريقة ، ويجب استخدام الطريقة التالية. بالنسبة إلى Firefox و Safari ، سيتم تحويل اللون إلى تنسيق RGB.
3. element.currentStyle: IE مخصص ، والذي يعيد قيمة سمة CSS النهائية للعنصر المطبق حاليًا (بما في ذلك ملفات CSS الخارجي ، <style> سمات مضمنة في الصفحة ، إلخ).
نسخة الكود كما يلي:
var ele = document.getElementById ('eLe') ؛
var styles = ele.currentStyle ؛
الأنماط.
ملاحظة: للحصول على حدود السمة الشاملة ، وما إلى ذلك ، أي إرجاع غير محدد. بعض المتصفحات الأخرى تُرجع القيم ، وبعضها لا يعود ، ولكن سمات مثل قيم إرجاع Bordleftwidth.
4. getPropertyValue (): احصل على اسم الخاصية المباشرة لأسلوب CSS
نسخة الكود كما يلي:
var ele = document.getElementById ('eLe') ؛
window.getComputedStyle (eLe ، null) .getPropertyValue ('color') ؛
ملاحظة: لا يدعم اسم السمة تنسيق الجمل ، IE6-8 لا يدعم هذه الطريقة ، وبالتالي فإن الطريقة التالية مطلوبة
5.
نسخة الكود كما يلي:
var test = document.getElementById ('test') ؛
window.getComputedStyle (اختبار ، null) .getPropertyValue ("BackgroundColor") ؛
ملاحظة: هذه الطريقة تدعم فقط IE6-8.
أسلوب الحصول على النمط التالي متوافق مع IE ، Chrome ، Firefox ، إلخ.
نسخة الكود كما يلي:
وظيفة getStyle (ele) {
var style = null ؛
if (window.getComputedStyle) {
style = window.getComputedStyle (ele ، null) ؛
}آخر{
النمط = ele.currentStyle ؛
}
نمط العودة
}
في jQuery ، يتم استخدام CSS () بشكل شائع للحصول على خصائص نمط ، وتطبق تشغيلها الأساسي أساليب GetComputedStyle و GetPropertyValue.