JQuery получить атрибут из стиля

Question

Мне нужно извлечь что-то из атрибута "style": атрибут "top" и "left"

<div style="top: 250px; left: 250px;" id="1" class="window ui-draggable">

Какой лучший способ сделать это с jQuery?Есть ли простой способ, или мне придется прибегнуть к строковым функциям?

Answer 1

Зависит от того, что вам нужно.Если вам нужно вычисленное значение - например, фактическое значение, используемое браузером после анализа всех таблиц стилей - используйте

$("#element_1").css("top")
$("#element_1").css("left")

Если это значение в пикселях, оно всегда будет тем, которое указано в style property - , если не было переопределено оператором !important в таблице стилей.

jQuery docs для .css()

Если вы явно нужно значение, указанное в свойстве style элемента, используйте

$("#element_1")[0].style.top
$("#element_1")[0].style.left

в отличие от .css(), эти значения будут пустыми, если они не были указаны в свойстве style.

(При использовании идентификатора element_1 у вас не может быть идентификатора с именем 1)

Answer 2

Вы можете использовать функцию CSS:

var topValue = $(this).css("top"); //Change the selector to meet your needs
var leftValue = $(this).css("left"); //Change the selector to meet your needs

Answer 3

Использование .css () вернет целое число + px, но вы можете легко получить хорошее чистое целое число, выполнив это:

var yourVar = parseInt($('selector').css('top'), 10);

Answer 4

Свойства CSS доступны через стандартные свойства DOM:

alert( $("#theElement")[0].style.top ) // "250px"
alert( $("#theElement")[0].style.left ) // "250px"

Кроме того, "1" не является допустимым идентификатором HTML-элемента.

Answer 5

https://developer.mozilla.org/en/DOM/window.getComputedStyle