我正在更新一个播放youtube视频的javascript前端的DOM对象(使用嵌入的youtube)。
现在,我希望DOM对象一更新,页面就会刷新:我更新视频的源(URL),并希望当前视频停止,新视频立即开始播放。
我使用
document.getElementById("embed_id").src=newUrl.fetch_url;
其中:
"embed_id“:是我赋予youtube-embed对象元素的id;
src :用来播放源url的参数
newUrl.fetch_url :内部参数,包含新视频的url
目前发生的情况是,当我查看Javascript调试器时,我可以看到元素和src值已更新,但原始视频仍在播放。如何刷新DOM才能开始播放新视频?
发布于 2011-03-08 14:37:46
所以最终我没有更新,而是追加了一个新元素:
var body = document.getElementById('body');
var newObject = currentObject.cloneNode(true);
newObject.childNodes[1].setAttribute('value',"http://www.youtube.com/v/"+newUrl.fetch_url+"?enablejsapi=1&version=3&autohide=1&showinfo=0?fs=1&autoplay=1");
$('body').append(newObject).hide().fadeIn(10000);
我使用childNodesi.setAttribute()找到了要更新的正确位置。
正如@Myles所说的,我找不到一种方法来实时更新DOM,但是在这个附加之后,我将删除旧对象。
发布于 2011-03-08 06:44:08
好的,你要做的是:
var embedded = document.getElementById("embed_id");
while (embedded.hasChildNodes()) {
embedded.removeChild(embedded.firstChild);
}
//Re-run DOM insertion here.
这将删除embedded
的所有子项,以允许您重新插入带有新URL的youtube嵌入。
更新
这有效地“触及”了DOM元素,这应该是您正在寻找的……
var other = element.nextSibling;
if ( other ) {
other.parentNode.removeChild(element);
other.parentNode.insertBefore(element,other);
} else {
other = element.parentNode;
other.removeChild(element);
other.appendChild(element);
}
https://stackoverflow.com/questions/5226444
复制相似问题