我可以通過jQuery訪問存儲在html元素數據屬性中的散列嗎？

我有幾個HTML元素我追加哈希喜歡這樣：我可以通過jQuery訪問存儲在html元素數據屬性中的散列嗎？

<p class='message' data-dependencies={'#first':{'equal':'Yes'}}> 
    Relevant Content 
</p>

使

$(".message").first().data("dependencies")

回報

{'#first':{'equal':'Yes'}}

但作爲一個哥們剛指出，對我來說，這個值是一個字符串。所以自然下面描述的過濾器很難用它。

過濾器的目標是能夠抓取具有指定鍵的元素，在本例中爲「#first」。

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

是否有經由數據對象通過或有另一種辦法可以構造數據，以便完成的能夠選擇基於所述關鍵要素相同的手段來訪問該散列的方法嗎？

來源

2012-10-30 biagidp

如果你只關心他們是否有一個鍵，然後返回'dependency_hash.indexOf（「 '＃第一'」）= - 1;！'應該這樣做。如果您需要實際獲取值或將其用作對象，那麼'dependency_hash = JSON.parse（dependency_hash）;'將從字符串中創建一個對象。 _除了有效的JSON應該使用雙引號，而不是單引號 - 你能翻轉雙引號和單引號嗎？ 'data-dependencies ='{「＃first」：{「equal」：「Yes」}}'' – nnnnnn

你想通過將數據存儲在DOM元素上來完成什麼？可能有更好的方法來做到這一點。像這樣將狀態信息存儲在DOM中通常是一種不好的做法。 – justspamjustin

它與狀態無關，它與顯示屬性有關。 – biagidp

如果您將其存儲爲有效的JSON，則可以解析它並獲取內容。

<p class='message' data-dependencies='{"#first":{"equal":"Yes"}}'> 
    Relevant Content 
</p>

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"

或者，如果你使用jQuery的.data()，它會自動解析它。

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

alert(parsed["#first"].equal); // "Yes"

來源

2012-10-30 20:52:11

接受的完整性，並幫助我實現使用雙引號的數據字符串是一個壞主意。 – biagidp

您可能想要將您的數據序列化爲JSON http://json.org/，然後將其恢復到JS中。你可以使用jQuery的解析器http://api.jquery.com/jQuery.parseJSON/

來源

2012-10-30 20:51:18

使用JSON.parse。如果您在舊版瀏覽器中需要支持，那麼會有polyfills。

$el.children().find("*").filter(function(){ 
    var dependency_hash = $(this).data("dependencies"); 
    var parsed_hash = JSON.parse(dependency_hash); 
    if(parsed_hash != undefined && "#first" in parsed_hash){ 
     return true 
    } 
});

來源

2012-10-30 20:51:29

我可以通過jQuery訪問存儲在html元素數據屬性中的散列嗎？

回答

相關問題