Estoy tratando de obtener la lista de propiedades CSS de un elemento que se anula, ejemplo:
.div{ position:absolute; top:10px; }Cuando usamos este código:
jQuery('.div').css('bottom');Yo obtengo:
bottom:-10px;Si uso obtener computado o jquery.css obtendré el mismo resultado, pero de hecho quiero obtener:
empty or nullporque no especifiqué / anulé.
Valores esperados en este ejemplo: superior: 10px inferior: automático o nulo o nada
https://codepen.io/anon/pen/dvvdVv
Una vez más, solo quería las propiedades anuladas.
===================== EDITAR ======================
Mi objetivo es solo obtener el valor top,bottom del siguiente elemento:
<div id='box' class='giveItSomeTop' style="top:10px"></div> y el css para el elemento, observe que solo he especificado top :
.giveItSomeTop{ top:10px; }Ahora quiero obtener el valor superior y el valor inferior. Si lo hago:
$('#box').css('top'); El resultado es: 10px pero cuando lo hago:
$('#box').css('bottom'); Obtengo 700px cuando debería estar empty , nothing , null o ''
Es algo realmente complicado lo que tienes allí, mis únicas sugerencias aquí son:
Configure la parte superior/inferior con javascript nativo, por lo que si configura la parte superior = 10px, obtendrá element.style.top == 10px, si no configuró esta propiedad, obtendrá "".
Agregué un ejemplo aquí, no es la mejor solución, pero tal vez ayude:
$( document ).ready(function() { var box = document.getElementById("box"); // Set it like this var top = box.style.top = "20px"; var bottom = box.style.bottom; // And you get 20px $('#top').text(top); // If unset you get "" $('#bottom').text(bottom); console.log(top); }); #box { position: absolute; width:30px; height:30px; background-color:red; top:10px; } p { position:relative; top:40px; font-size:12px; color:black; } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id='box'></div> <p id='top'></p> <p id='bottom'></p>Desafortunadamente, no está utilizando el método jQuery css() como se pretende.
Obtenga el valor de una propiedad de estilo calculada para el primer elemento del conjunto de elementos coincidentes o establezca una o más propiedades CSS para cada elemento coincidente.
Esto significa que no le importa lo que el archivo CSS haya aplicado a este elemento, solo buscará lo que le haya pedido que busque en el elemento.
Lo que deberá hacer es escribir un analizador de archivos CSS y luego consultar desde eso ... Pero es otra herramienta / biblioteca que deberá implementar.
Y hay respuestas para dicha herramienta en StackOverflow: Parsing CSS in JavaScript / jQuery
Y/O:Convertir texto CSS en objeto JavaScript
Desde aquí se le dará un null | undefined para propiedades de objetos que no existen.