javascript - 数据属性未添加到创建的元素

Question

我创建了一个新的 div 元素，我想向其添加一些数据属性，因此我设置了以下代码:

vjs.LikeButton = vjs.Button.extend({
  /** @constructor */
  init: function(player, options){
    vjs.Button.call(this, player, options);
  }
});

vjs.LikeButton.prototype.createEl = function(){
    return vjs.Button.prototype.createEl.call(this, 'div', {
        'id': 'video-fb-like',
        'className': 'fb-like',
        'innerHTML': '',
        'data-send': "false",
        'data-layout': "box_count",
        'data-width': "55",
        'data-show-faces': "false",
        'data-colorscheme': "dark",
        'data-href': this.player().options().shareUrl
  });
};

然而，问题在于该元素获得了新的类和 ID，但未添加数据属性。谁能告诉我为什么会这样？

Answer 1

这是因为 video.js 设置属性的方式:

el[propName] = properties[propName];

data 属性不能在支持它们的浏览器中以这种方式设置。所以你必须自己做，例如与

var button = vjs.Button.prototype.createEl.call(...
button.setAttribute('data-send', 'false');