随机HTML代码由Javascript生成?

时间:2015-02-11 20:29:20

标签: javascript html5

我有一个简单的问题。我的音频播放器有这个代码:

<audio class="audio-element" controls="true" preload="none">
  <source src="mp3file.mp3" type="audio/mpeg" /><br>
  <b>Your outdated browser does not support HTML5. <br>
     Get Mozilla Firefox <a href="https://www.mozilla.org/pl/firefox/new/"> >HERE< </a>
  </b>
</audio>

是否可以使用Javascript随机生成源src?

3 个答案:

答案 0 :(得分:0)

您的问题非常混乱,但您可以创建这样的元素

var source = document.createElement('source');

并为其提供src属性,例如

source.src = 'myaudio.mp3';

答案 1 :(得分:0)

您可以创建一个元素并对其应用随机属性 - 在这种情况下,将随机音频文件分配给src。基本技术可能是:

var audioFiles = [ 'music1.mp3', 'music2.mp3', 'music3.mp3' ]; 
// The above array would be populated from an AJAX call to the server to get
// the filenames, or however you get getting the filenames already 
var audio = document.getElementById('audio'); // or whatever ID you assign
var source = document.createElement('source'); 
var source.src = audioFiles[Math.floor(Math.random() * audioFiles.length)];
audio.appendChild(source); 

答案 2 :(得分:0)

随机来源是什么意思?如果为源生成随机字符串,则可能无效。我想你想要的是拥有一系列有效的资源并随机选择其中一个有效资源。

在这种情况下你会这样做:

<强> HTML

<audio class="audio-element" controls="true" preload="none" id='audio'>

<强>的JavaScript

Math.randInt = function(min, max){
  return Math.floor((Math.random()*((max+1)-min))+min);
};
var sources = [
    "source1.mp3",
    "source2.mp3",
    "source3.mp3"
];
document.getElementById("audio").src = sources[Math.randInt(0, sources.length-1)];

这将从一系列有效来源中挑选一个随机来源,我认为这就是你想要的。但是如果你想生成一个“随机源”,你可以做一些像这样的蠢事:

<强> HTML

<audio class="audio-element" controls="true" preload="none" id='audio'>

<强>的JavaScript

Math.randInt = function(min, max){
  return Math.floor((Math.random()*((max+1)-min))+min);
};
document.getElementById("audio").src = Math.randInt(999999999,9999999999).toString(36);+".mp3";

这会产生一个随机的数字和字母串作为你的来源。但为什么呢?