javascript - 在 JavaScript 中从列表中的对象获取数据属性

标签 javascript dataset custom-data-attribute

我有一个对象列表

[Object, Object, Object]

每个对象都有

Object {x: 1, y: 0, width: 4, height: 5, max_width: undefined…}

以及其他一些参数。每个对象都是一个<div>具有数据属性的元素 <div id="panel" data-panel-id="2"> 。我怎样才能得到data-panel-id的值?

我已经尝试过

items.forEach(function (item) {
  console.log(item);
  console.log(item.el);
  console.log(item.el.firstNode);
  console.log(item.el.firstNode.dataset);

等等

我认为如果我使用 document.getElementById("panel").dataset.panelId 就会起作用但我的列表包含对象而不是 html 元素,所以我不知道该怎么做。

我的对象列表是在 onChange 监听器中从 gridstack.js 库 ( https://github.com/troolee/gridstack.js ) 创建的。

最佳答案

我从未使用过这个库,但我刚刚检查了该库,发现每个项目对象在 el 属性中都有它的 DOM 节点。所以我们可以通过以下方式设置数据:

    items.forEach(function (item) {
     var panelId =  item.el[0].dataset['panelId'] //el[0] --> Since el is a jQuery object we need to get it's javascript object.

     //If you want to use jQuery:
     var panelId =  item.el.data('panelId');
    }

关于javascript - 在 JavaScript 中从列表中的对象获取数据属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33019632/

相关文章:

javascript - 重定向到 ReactJS 中的结帐

javascript - 相同的 cookie,ColdFusion 和 JavaScript 之间的值不同

javascript - Web 上圆 Angular 图像的最佳实践

java - 以正确的形式在 JSON 文件中写入数据 JAVA

c# - 使用 LINQ 仅返回包含多个 DataTable 的 DataSet 中的两个特定 DataTable

jquery - 使用 jquery 过滤具有多个数据属性的元素

css - Vue - 在CSS中获取数据属性值

javascript - Jasmine 是否支持带有 =>(箭头)的 javascript

c# - c# 中的数据集前 n 行

jquery - 如何保留数据属性的大小写?