Question

我的意思是在运行时向DOM插入一个小脚本以加载视频播放器。但是除了我想要的<div>之外，玩家会被加载到所有不同的地方。我不明白如何处理这个问题。我在这里粘贴整个代码。请帮帮我。

<html>
<head><title>video test</title>
<script type="text/javascript" src="resources/js/jquery.js"></script>
<script type="text/javascript" src="swf.js"></script>
<script type="text/javascript">

$(document).ready(function(){
//  debugger;
    var template = $('<div class="sResult"><div class="figure"></div><div class="title"></div></div>');
    var url = 'http://player.ooyala.com/player.js?width=320&amp;height=240&amp;embedCode=thbXMxMzpq0RhOS82Hzx1lma8UMnFN-3&amp;callback=apicallback';
    var tempScript = document.createElement('script');
    tempScript.type = 'text/javascript';
    tempScript.src = url;

    $("#main").append(template);


    $("div.figure", $('#main')).html(tempScript);
    $("div.title", $('#main')).append("testkjdfnkjdb");

})
</script>   

</head>
<body>
    <div id="main"></div>
</body>
</html>

div.title的附加程序运行正常。但是我试图附加视频播放器的div无法正常工作。视频播放器会附加到<head>

编辑：有些javascript大师可以查看player.js并告诉我为什么它不适用于我？

播放器<div>包含以下内容：

<div style="width: 320px; height: 240px; overflow: hidden;" id="ooyalaPlayer6764909_10qreejOoyalaPlayerOutterWrapper"><object width="320" height="240" type="application/x-shockwave-flash" id="ooyalaPlayer6764909_10qreej" class="OoyalaVideoPlayer" data="http://player.ooyala.com/static/cacheable/fb1a00342b9ec2d6df7c69946617dcee/player_v2.swf"><param name="allowScriptAccess" value="always"><param name="allowFullScreen" value="true"><param name="bgcolor" value="#000000"><param name="wmode" value="window">
<param name="flashvars"></object></div>

Answer 1

您还可以为Ooyala播放器提供targetReplaceId =（元素ID）查询字符串参数，以强制它替换页面上的项目。

Answer 2

首先修复您的网址，传递playerId参数。

    var url = 'http://player.ooyala.com/player.js?playerId=player&width=320&amp;height=240&amp;embedCode=thbXMxMzpq0RhOS82Hzx1lma8UMnFN-3&amp;callback=apicallback';

为tempScript加载器创建一个侦听器，并将播放器脚本附加到标题：

$(tempScript).load(function() {
     $('#main').find('div.figure').append($('head>div'));
});
$('head')[0].appendChild(tempScript);

在监听器中移动您想要重新附加它的播放器中的内容。

我认为问题出在player.js中，而不是你附加脚本加载器的地方。

Ooyala API文档：http://ooyala.com/support/docs/player_api#javascript

Answer 3

你的选择器错了：

$("#main div.figure").html(tempScript);

等。

DOM脚本插入

3 个答案: