将 javascript 变量添加到 javascript src

Add javascript variable to javascript src?

本文关键字:javascript src 变量 添加      更新时间:2023-09-26

这听起来可能有点菜鸟,但我正在尝试检索YouTube视频的视频信息(我在一些教程中看到)基本上是代码

    function youtubeFeedCallback1(data) {
        var s = '';
        var k = '';
        s += data.entry.title.$t;
        k += data.entry.media$group.media$thumbnail[2].url;
        vidtitle1=s
        vidthumb1=k
      }
 <script type="text/javascript" id="javaone" src='http://gdata.youtube.com/feeds/api/videos/'+vidid[0]+'?v=2&amp;alt=json-in-script&amp;callback=youtubeFeedCallback1' ></script>

如您所见,我正在尝试在 src 中插入 var "vidid[0]",但这不起作用。现在,我确实做了功课,但是当我设置一个新的脚本属性并设置新的 src tot 时,它仍然不起作用。谁能在这里帮我?

你尝试做的事情被称为JSONP。由于您无法使用常规 Ajax 调用从另一个域获取 JSON(这会具有安全隐患),因此您必须添加一个脚本来调用您指定的回调函数,并向其传递 JSON。正如其他答案所说,您必须以编程方式创建脚本标记。我不会为此使用document.write,因为它在页面加载后不起作用(新脚本将替换整个文档)。但是有一个非常简单的替代方案:

function youtubeFeedCallback1(data) {
    var s = '';
    var k = '';
    s += data.entry.title.$t;
    k += data.entry.media$group.media$thumbnail[2].url;
    vidtitle1=s;
    vidthumb1=k;
}
var script = document.createElement('script');
script.src = "http://gdata.youtube.com/feeds/api/videos/" + vidid[0] + "?v=2&amp;alt=json-in-script&amp;callback=youtubeFeedCallback1";
document.body.appendChild(script);

最后一个建议:我看到你的回调上有全局变量,vidtitle1vidthumb1。无论您需要对它们的值做什么,都可以从回调中执行(最好摆脱全局变量),否则它很可能不起作用。数据将以异步方式加载,因此只有在回调运行才能保证变量包含其值。

虽然 CDATA 工作正常,但使用 document.createElement 也是一个不错的选择。特别是如果您打算将一些值附加到URL,例如用于缓存破坏。

<script type="text/javascript"> 
    var versionJSLink = "/Folder/sub_folder/version.js?version=" + Math.random();
    JSElement = document.createElement('script');
    JSElement.src = versionJSLink;
    JSElement.onload = OnceLoaded;
    document.getElementsByTagName('head')[0].appendChild(JSElement);
    function OnceLoaded() {
        // Once loaded.. load other JS or CSS or call objects of version.js
    }
</script>

玩得开心.. :)

document.write it 或 createElement()/appendChild()

var id = "asdf";
document.write(''x3Cscript type="text/javascript" src="foo.js?id=' + id + '">'x3C/script>');

页面中的代码片段在哪里?如果它位于 <script> 标签内,问题是脚本标签被解释为 javascript,而不是 html。相反,您可以使用原始脚本标记document.write将脚本标记写入 dom。

新代码将如下所示:

function youtubeFeedCallback1(data) {
    var s = '';
    var k = '';
    s += data.entry.title.$t;
    k += data.entry.media$group.media$thumbnail[2].url;
    vidtitle1=s
    vidthumb1=k
  }
document.write("<script type='"text/javascript'" id='"javaone'" src='"http://gdata.youtube.com/feeds/api/videos/'"+vidid[0]+'"?v=2&amp;alt=json-in-script&amp;callback=youtubeFeedCallback1'"></script>");

脚本标签需要用javascript编写才能访问vidid变量,但这意味着你必须操作DOM才能添加脚本标签,因为你不再在HTML中。

function youtubeFeedCallback1(data) {
  var s = '';
  var k = '';
  s += data.entry.title.$t;
  k += data.entry.media$group.media$thumbnail[2].url;
  vidtitle1 = s
  vidthumb1 = k
}
<script id="javaone"></script>
<script>
  
  var fullSrc = "http://gdata.youtube.com/feeds/api/videos/"+vidid[0]+"?v=2&amp;alt=json-in-script&amp;callback=youtubeFeedCallback1";
  
  $('#javaone').attr("src",fullSrc);
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

我想你明白了:1. 创建空脚本容器。2. 在变量中定义完整的链接。3. 将此变量设置为空脚本的 SRC 属性。

附言不知道它是否适用于 js。这是jquery