使用data属性拉入JS内容

Question

所以我对数据属性不太熟悉，我想看看我是否可以从别人那里得到一些帮助。

我有一个HTML部分，如下所示:

<div class="columns is-multiline app-list"></div>

app-list由以下JS渲染:

是否有一种方法，而不是调用app-list作为一个类，我可以这样做:

<div class="columns is-multiline" data-source="application_launcher"></div>?

所有的帮助将不胜感激!

Answer 1

可以在querySelector(selector)方法中使用data-attribute作为selector。

在这种情况下只需替换

const apps_target = document.querySelector('.app-list');

与下面的行。

const apps_target = document.querySelector('[data-source="application_launcher"]');