我有这个标记,例如:
<div class="playlist-item" data-mp4="01.mp4" data-mp4-720p="02.mp4" data-mp4-1280p="03.mp4"></div>
我想选择'data-mp4'属性以便它们出现在html中,所以我最终得到这样的数组:
[{quality: 'default', path:01.mp4}, {quality: '720p', path:02.mp4}, {quality: '1280p', path:03.mp4}]
我试过这个但是看起来不同的浏览器对这些属性的命令不同:
var track = playlist.find("div[class='playlist-item']");
$.each(track[0].attributes, function (i, e) {
if(/mp4/.test(e.name)){
}
});
答案 0 :(得分:2)
当HTML代码被解析为元素时,HTML中的属性顺序不会被保留,因此您无法按照它们在HTML中的顺序获取属性。
如果您希望按特定顺序使用属性值,则必须在从元素中获取属性值后对其进行排序。
示例:
var attr = Array.prototype.slice.call(track[0].attributes);
attr.sort(function(x, y){
return x.name < y.name ? -1 : x.name > y.name ? 1 : 0;
});
要确定属性的顺序,您可以使用地图将名称转换为值:
var attr = Array.prototype.slice.call(track[0].attributes);
var map = { "data-mp4" : 1, "data-mp4-720p": 2, "data-mp4-1280p": 3 };
attr.sort(function(x, y){ return map[x.name] - map[y.name]; });
答案 1 :(得分:0)
一个选项:通过数据道具访问它。然而,有一个问题。如果您有data-some-prop
数据支持,则jquery规范声明必须将其称为$.data('someProp')
而不是some-prop
。这是一个catch,因为它必须是一个字符串而不是一个数字 - 选择器不起作用。如果您将属性更改为data-720p
和data-1280p
,则可以使用以下内容:
var track = $('.playlist-item')[0]
var qualityArray = [
{quality: 'default', path: $(track).data('mp4')},
{quality: '720p', path: $(track).data('720p')},
{quality: '1280p', path: $(track).data('1280p')}
]
如果您想要更具描述性的数据名称,可以使用以data-mp4-hd
和data-mp4-fullhd
等字符串开头的内容,如$.data('mp4Hd')