¿Cómo implementar javascript para obtener con precisión el valor del atributo CSS de un elemento? Cuando tratamos con las propiedades CSS de los elementos DOM, a menudo nos encontramos con un problema: el valor de la propiedad CSS se ha definido en la página, pero está vacío cuando se obtiene. Esto se debe a que cualquier archivo de hoja de estilo o información de estilo predeterminado CSS en línea no se puede reflejar de manera confiable. en el atributo de estilo. Este artículo le presenta el método para obtener con precisión el valor del atributo CSS de un elemento específico.
JavaScript:
Código fuente de ejemplo
[www.downcodes.com]
función getStyle(elem, nombre)
{
//Si este atributo existe en estilo[], se configuró recientemente (y es el actual)
si (elem.estilo[nombre])
{
devolver elem.style[nombre];
}
// De lo contrario, prueba el método IE
de lo contrario si (elem.currentStyle)
{
devolver elem.currentStyle[nombre];
}
//O método W3C, si existe
de lo contrario si (document.defaultView && document.defaultView.getComputedStyle)
{
//Utiliza el método tradicional de escritura de reglas de estilo "text-Align" en lugar de "textAlign"
nombre = nombre.replace(/([AZ])/g,"-$1");
nombre = nombre.toLowerCase();
//Obtiene el objeto de estilo y obtiene el valor del atributo (si existe)
var s = document.defaultView.getComputedStyle(elem,"");
return s && s.getPropertyValue(nombre);
//De lo contrario, estás utilizando otro navegador
}
demás
{
devolver nulo;
}
}