Question

我有一个应用程序，其中（非IT）用户创建和维护产品页面（产品是音乐CD），因此这些页面包含有关CD的常用模糊和轨道列表。我们想在每首曲目中插入一个mp3音乐播放器，但需要保留内嵌的代码＆＃39;尽可能简单地使用加法器，例如<player url:fileRef />

然后，页面上的每个实例将在显示时注入~20行html和唯一的fileRef。

最好的方法是什么？ JavaScript的？ jQuery的？我读到'document.write' - 不是答案。 document.getElementByClassName("player").innerHTML = "html goes here";是最好的方式＆gt;

我读到.getELementByClassName("player")替换了类的所有实例 - 所以如何最好地将唯一的fileRef注入到每个实例中。

非常欢迎您的指导

PS我们已经拥有（html5）mp3音乐播放器，但每个实例的html约为20行。

Answer 1

如果您想添加班级＆＃39;播放器，那就没问题了。对于您的每个元素，但您的选择器不应该是document.getElementsByClassName("player")，因为它不会将任何元素彼此区分开来。理想情况下，您可以拥有一个ID列表，您可以循环使用这些ID来选择各个元素。这样的事情可以奏效：

var ids = ["id1", "id2", "id3", "id4"];
var i;
for(i = 0; i < ids.length; i++) {
  var player = document.getElementById(ids[i]);
  player.innerHTML = getHtmlForPlayer(id[i]); // you'll need to build this
}

请注意，我在不太了解您的HTML生成方式的情况下写了这篇文章，但它应该让您入门。

Answer 2

使用jQuery，您可以使用类似

的内容

$("player").each(function(){
  var id = $(this);
  var url = $(this).prop("url");
  $.get(url, function(data){
    $(id).html(data);
  }
}

请注意，这是未经测试的，我会选择带有class =＆＃34;播放器＆＃34;的span / div，以及使用data-url标签。

<span class="player" data-url="url"></span>

然后将$（＆＃34;播放器＆＃34;）更改为$（＆＃34; .player＆＃34;）

如何从函数

2 个答案: