javascript - 如何使用 jQuery 在不在 DOM 中的元素上设置数据属性？

Question

如何使用 jQuery 在尚不在 DOM 中的元素上设置数据属性？

代码:

   var panelHeading = $('<div/>', {class:'panel-heading', href:'#'+username+'PanelContent'});
   panelHeading.data('toggle', 'collapse').data('target',"#"+username+"PanelContent");

当我将数据附加到文档时，数据属性不会出现。其他属性确实出现。

Answer 1

您可以在创建元素时添加数据属性

var panelHeading = $('<div />', {
    'class'       : 'panel-heading', 
    href          : '#'+username+'PanelContent',
    'data-toggle' : 'collapse',
    'data-target' : '#'+username+'PanelContent'
});

使用 data() 在 jQuery 内部存储数据，它不会创建 HTML 属性，因此它与 Bootstrap 之类的属性的配合效果很差