2012-01-14 48 views
8

使用Javascript,我有一個函數可以創建一個帶有createElement("audio")的音頻元素,並開始循環播放,而不使用appendChild(),我的意思是沒有將其附加到DOM。 創建保存在一個變量中的元素,讓我們把它叫做music1如何在不附加到DOM的情況下正確刪除html5音頻?

music = document.createElement("audio"); 
music.addEventListener("loadeddata", function() { 
music.play(); 
}); 
music.setAttribute("src", music_Source); 

我想什麼做的,是改變音樂聲響起,如果有可能使用相同的功能,和存儲單元在同一變量。

我要做的是,上面的代碼之前:

if(typeof(music) == "object") { 
music.pause(); 
music = null; 
} 

但是:如果我刪除music.pause(),第一音樂繼續播放,而第二開始在同一時間播放過,這讓我覺得第一首音樂總是在文檔/內存中的某處。另外,music = null似乎沒用。我不想使用jQuery。

您是否有任何想法可以正確刪除第一首音樂,刪除元素等等?其實,肯尼斯的評論是正確的,我試圖改變src屬性,而不是修改「音樂」變量(既沒有設置它爲null,也沒有重新創建一個元素),它似乎也起作用。所以,備案:對於每個源改變這裏的功能是:

if(typeof(music) != "object") { 
    //audio element does not exist yet: 
    music = document.createElement("audio"); 
    music.addEventListener("loadeddata", function() { 
    music.play(); 
    }); 
} 
music.setAttribute("src", music_Source); 
+1

您已經回答了您的問題! 'music.pause()'在刪除對象之前。 – 2012-01-14 19:58:14

+3

當你準備開始新歌曲時,你是否有理由不想改變'src'屬性? – 2012-01-14 20:03:31

+0

@kennis其實,'music.setAttribute(「src」,music_Source);'用第二個音樂的新music_Source再次調用,所以我想這就是你的意思,我改變了src屬性。 @Francis Avila但是我並不確定music.pause()在刪除之前允許以任何適當的方式「刪除」以前的音樂。或者我可能會錯過某些東西,或者我沒有足夠的自我解釋:) – 2012-01-15 00:06:33

回答

8

而不是刪除,這樣做的更好的方式是改變SRC

music.setAttribute('src',theNewSource); //change the source 
music.load(); //load the new source 
music.play(); //play 

這樣你總是處理相同的對象,所以你不經常碰到DOM,並且避免了同時有兩個播放器的問題

另外請確保使用.load方法加載新的音頻,否則它會繼續玩舊的。

+2

實際上,它似乎無負載運行(),之前的音樂停止播放,新的播放開始播放。看起來音樂開始在源代碼更改時加載(至少在Chrome上,因爲我正在使用特定於webkit的應用程序)。但改變源頭的確是解決方案。 – 2012-01-16 15:45:54

2

原始對象將被刪除,但只有當垃圾回收器確定它是時間的時候。事實是audio可能會使事情變得複雜,並使瀏覽器難以做出這樣的決定。

所以,是的,只是重新使用原來的對象。

相關問題