将 javascript 变量添加到 javascript src？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14554928/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Add javascript variable to javascript src?
提问by bluejayke
this may sound a bit noobish, but I'm trying to retrieve the video information for a YouTube video (I saw in some tutorial) basically here's the code
这可能听起来有点 noobish，但我正在尝试检索 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&alt=json-in-script&callback=youtubeFeedCallback1' ></script>
As you can see, I'm trying to insert the var "vidid[0]" in the src, which doesnt work. Now, I did do my homework, but when i set a new script attribute and set the new src tot that it still does not work. Can anyone help me here?
如您所见，我正在尝试在 src 中插入 var "vidid[0]"，但这是行不通的。现在，我确实做了功课，但是当我设置新的脚本属性并设置新的 src 时，它仍然不起作用。有人能帮我一下吗？
回答by bfavaretto
What you're trying to do is called called JSONP. Since you can't use a regular Ajax call to fetch JSON from another domain (it would have security implications), you have to add a script that will call the callback function you specify, and pass it the JSON. As other answers say, you have to create the script tag programmatically. I wouldn't use document.writefor that, because it won't work after page load (the new script would replace the whole document). But there is a very simple alternative:
您正在尝试做的称为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&alt=json-in-script&callback=youtubeFeedCallback1";
document.body.appendChild(script);
One last recommendation: I see you have global variables on your callback, vidtitle1and vidthumb1. Whatever you need to do with their values, do it from the callback (and preferably get rid of the global variables), or chances are it won't work. The data will be loaded asynchronously, so the variables are only guaranteed to contain their values afterthe callback runs.
最后一个建议：我看到您的回调中有全局变量，vidtitle1并且vidthumb1. 无论您需要对它们的值做什么，都可以从回调中进行（最好去掉全局变量），否则很可能不起作用。数据将异步加载，因此只有在回调运行后才能保证变量包含它们的值。
回答by Mahesh
Though CDATA works fine, using document.createElement is also a great choice.. Especially if you intend to append some value to a URL, say for cache busting..
尽管 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>
Have fun.. :)
玩得开心.. ：）
回答by epascarello
Either document.write it or createElement()/appendChild()
document.write it 或 createElement()/appendChild()
var id = "asdf";
document.write('\x3Cscript type="text/javascript" src="foo.js?id=' + id + '">\x3C/script>');
回答by Hymanson
Where is the code snippet within the page? If it's inside a <script>tag, the problem is that the script tag is being interpreted as javascript, not html. Instead, from the original script tag you can use document.writeto write the script tag to the dom.
页面中的代码片段在哪里？如果它在<script>标签内，问题是脚本标签被解释为 javascript，而不是 html。相反，您可以使用原始脚本标签document.write将脚本标签写入 dom。
The new code would be something like:
新代码类似于：
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&alt=json-in-script&callback=youtubeFeedCallback1\"></script>");
The script tag needs to be written in javascript to access the vididvariable, but that means you have to manipulate the DOM in order to add the script tag since you're no longer in HTML.
脚本标签需要用 javascript 编写才能访问vidid变量，但这意味着您必须操作 DOM 才能添加脚本标签，因为您不再使用 HTML。
回答by someone
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&alt=json-in-script&callback=youtubeFeedCallback1";
$('#javaone').attr("src",fullSrc);
</script><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>I think you get the idea: 1. create empty script container. 2. define the complete link in a variable. 3. set this variable as a src attribute to the empty script.
我想你明白了： 1. 创建空的脚本容器。2.在一个变量中定义完整的链接。3. 将此变量设置为空脚本的 src 属性。
p.s. don't know if it works in js. This is jquery
ps 不知道在 js 中是否有效。这是jquery
