从DOM访问元素

Question

我使用jquery动态创建元素。这是我的代码

function showArticles(res) {

    var output = '';

    res.articles.forEach(function (item) {

      output +=

        '<div class="col-12 col-lg-4 item-article" data-name="'+ item.author +'>'+

          '<p>' + item.description + '</p>'

          +

        '</div>'

      });

    articleWrapper.append(output);

我想访问该data-name属性

var itemArticle = $('.item-article').attr("data-type");

console.log(itemArticle)

退货undefined。

如何访问data-name属性，为什么会发生这种情况？

Answer 1

您可以使用&nbsp;var itemArticle = $('.item-article').data("name");

Answer 2

您得到错误的属性。之后showArticles被调用时，你可以这样做：var itemArticle = $('.item-article').attr("data-name");// Orvar itemArticle = $('.item-article').data("name");

Answer 3

您尝试使用的代码是jQuery代码。如果要使用它，则需要导入jQuery库。因为此问题未用jQuery标记，所以我假设您要使用普通的javascript。您可以使用此函数querySelectorAll()来获取匹配的元素。循环遍历这些元素，然后运行getAttribute()函数以获取属性值。var items = document.querySelectorAll('.item-article');items.forEach((item) => {&nbsp; var dataName = item.getAttribute('data-name');});