jquery - 我将如何从数据属性中获取值之一

Question

我有一个具有多个值的数据属性。我将如何从中获得一个价值？

<div data-url='{"header-url" : "src/one.html","footer-url" : "src/two.html","content-url" : "src/three.html"}'></div>

$(document).ready(function() {
 var headerContent = $('div').attr('data-url');
 console.log(headerContent)
});

http://jsfiddle.net/taGBL/19/

Answer 1

利用bracket notation

$(document).ready(function() {

    var headerContent = $('div').data('url');

    console.log(headerContent['header-url']);
    console.log(headerContent['footer-url']);
    console.log(headerContent['content-url']);

});

Fiddle

Answer 2

看看你可以使用Bracket Notationjavascript 中可用的方法，你也不需要在.attr()这里使用 jQuery 的方法，因为你data-*在该属性中有一个前缀，所以你肯定可以使用在你的情况下有效的.data()方法：jQuery

$(document).ready(function() {
   var headerContent = $('div').data('url');
   console.log(headerContent['header-url']); // <--with bracket notation.
});

或者，如果您想获取所有值，则可以$.each()为此使用方法：

$(document).ready(function() {
   var headerContent = $('div').data('url');
   $.each(headerContent, function(k, v){
       console.log(v); // this logs all the three values.
   });
});

摆弄$.each()方法。