使用 jquery 获取 HTML __data__ 属性的属性答案

【问题标题】：Grab properties of the HTML __data__ property using jquery使用 jquery 获取 HTML __data__ 属性的属性
【发布时间】：2016-07-31 03:58:27
【问题描述】：

我正在尝试获取 <g> 标签内的属性

这里是gtag的属性：

我要抢物业：病房

所有 g 标签都有点击事件，但我无法获取 ajax 请求所需的 ward 值，这里是 js：

$(".map-wrapper").on("click", "g", function(event) {
  event.preventDefault();
  console.log("I want this to be the value of the ward property");
 });

嵌套查询类似于 ["data"]["properties"]["ward"]

【问题讨论】：

为什么不直接使用d3获取数据呢？类似allgs.forEach(function(g) {console.log(d3.select(g).data())})
你可以使用jquery的.prop()来获取它吗？ api.jquery.com/prop
这就是我为获得所需价值所做的工作$(".map-wrapper").on("click", "g", function(event) { event.preventDefault(); $ward = $(this); console.log($ward[0].__data__.properties.ward); })'code
@Cyril 和 JordanHendrix，感谢您的建议，我尝试了他们两个但无法让他们工作...

标签： jquery html d3.js svg geojson

【解决方案1】：

所以我的问题的答案是隔离g标签，然后访问它的__data__属性，然后访问__data__的properties属性，然后访问properties的ward属性。

$(".map-wrapper").on("click", "g", function(event) { 
     event.preventDefault(); 
     $ward = $(this); 
     console.log($ward[0].__data__.properties.ward); 
});

【讨论】：

如果您使用的是 d3，请利用它的强大功能。
所以这就是我使用你的方法所做的，使用 d3 而不是 jquery 有什么好处？ d3.selectAll(".map-wrapper").on("click", "g", function(event) { event.preventDefault(); var ward = d3.select($(this)).data(). ward; var ajaxRequest = $.ajax({ url: "wards/" + ward, type: 'get' }); ajaxRequest.done(function (jsonWardCrimeData) { $('.load-animation').toggle(); $('.specific-data').html(jsonWardCrimeData); }); });

【解决方案2】：

 d3.selectAll(".map-wrapper").on("click", "g", function(event) {
    event.preventDefault();
    var ward = d3.select($(this)).data().ward; 
 });

这应该给你点击的g元素的病房

【讨论】：