Блог

Я хочу передать значение, заданное в таблице стилей, чтобы его можно было прочитать с помощью javascript / jQuery? Я думал о создании невидимого элемента и присвоении ему значения, но тогда мне пришлось бы включать этот элемент во все страницы, что довольно сложно. Просто хочу знать, есть ли альтернатива этому.

У меня есть скрипт изменения размера js для изображений, который изменяет размер на основе области, а не высоты или ширины, поэтому я не могу указать ему maxwidth или maxheight как таковые. если вы даете ему 100, это делает область изображения = 100 ^ 2. Я полагаю, я мог бы установить максимальную ширину элемента в два раза больше, чем я хочу, но мне просто интересно, есть ли более классный способ сделать это.

Насколько я знаю, браузеры отбрасывают атрибуты, которые они не понимают, поэтому, к сожалению, вы не можете просто ввести свои собственные data- * . Я думаю, вам, возможно, придется сделать это через скрытый элемент, что-то вроде приведенного ниже, который использует атрибут content:

 # styles.css
.data {
  display: none;
  content: "my data variable"
}

# index.html
<span class="data"></span>


# javascript
myData = $(".data").css('content')
  

Обновить

Играя в Chrome, похоже, что вы можете установить «содержимое» изображения, и оно не будет отображаться. Итак, вы могли бы сделать

 # styles.css
img {
  content: "100"
}
  

Не уверен, насколько хорошо это работает в разных браузерах, хотя, также просматривая спецификацию w3c, в ней говорится, что «содержимое» должно использоваться с :before или:after , поэтому не уверен, что вы столкнетесь с проблемами проверки там.

Почему бы просто не использовать javascript для запроса фактического элемента и чтения его свойств таким образом? Тогда вы вообще не полагаетесь на CSS.

$('someDiv').getWidth()