有没有像css的data- *属性？

Question

我想传递一个样式表中设置的值，以便它可以通过JavaScript/jQuery读取？我想创建一个不可见的元素并给它一个价值，但是接下来我必须在所有页面中包含这个元素，这很不好意思。只是想知道是否有其他选择。

我有一个基于区域而不是高度或宽度调整大小的图像的js调整大小脚本，所以我无法为它提供maxwidth或maxheight本身。如果你给它100，它会使图像的面积= 100^2。我想我可以将元素的maxWidth设置为我想要的数字的两倍，但我只是想知道是否有更好的方法来实现它。

Answer 1

为什么不只是使用JavaScript来查询实际的元素，并阅读它的属性呢？那么你根本不依赖于CSS。

$('someDiv').getWidth()

Answer 2

据我所知，浏览器扔掉，他们不明白的属性，所以很遗憾你不能只是注入自己的数据 - *。我想你可能通过一个隐藏的元素来做到这一点，类似下面，它使用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，所以不知道你是否会遇到验证问题。