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');

Answer 2

是IE浏览器中的这个问题吗？由于数据属性仅在html5中受支持，您可能需要检查浏览器的兼容性。

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

2 个答案: