我可以使用jquery访问存储在html元素数据属性中的哈希吗?

bia*_*idp 4 html javascript jquery

我有几个html元素,我附加哈希就像这样:

<p class='message' data-dependencies={'#first':{'equal':'Yes'}}>
  Relevant Content
</p>
Run Code Online (Sandbox Code Playgroud)

以便

$(".message").first().data("dependencies")
Run Code Online (Sandbox Code Playgroud)

回报

{'#first':{'equal':'Yes'}}
Run Code Online (Sandbox Code Playgroud)

但正如一位好友刚刚向我指出的那样,这个值就是一个字符串.所以下面描述的过滤器很自然地用它很难.

过滤器的目标是能够获取具有指定键的元素,在本例中为"#first".

$el.children().find("*").filter(function(){
    var dependency_hash = $(this).data("dependencies");
    if(dependency_hash != undefined && "#first" in dependency_hash){
      return true
    }
});
Run Code Online (Sandbox Code Playgroud)

有没有办法访问通过数据对象传递的哈希值,还是有另一种方法可以构建数据,以便实现能够根据键选择元素的相同方法?

I H*_*azy 6

如果将其存储为有效的JSON,则可以解析它,并获取内容.

<p class='message' data-dependencies='{"#first":{"equal":"Yes"}}'>
  Relevant Content
</p>
Run Code Online (Sandbox Code Playgroud)
var json = $(".message").first().attr("data-dependencies");

// HTML5 browsers
// var json = document.querySelector(".message").dataset.dependencies;

var parsed = $.parseJSON(data);

alert(parsed["#first"].equal); // "Yes"
Run Code Online (Sandbox Code Playgroud)

或者如果你使用jQuery .data(),它会自动解析它.

var parsed = $(".message").first().data("dependencies");

alert(parsed["#first"].equal); // "Yes"
Run Code Online (Sandbox Code Playgroud)