JavaScript : get src and set as variable?

Question

如果下面的图片存在

<img id="youtubeimg" src="http://i1.ytimg.com/vi/VK4ah66jBvE/0.jpg"/>

脚本是

<script>
var youtubeimgsrc = "something here"

document.write(''+youtubeimgsrc+'')
</script>

结果应该是http://i1.ytimg.com/vi/VK4ah66jBvE/0.jpg

我可以做什么来获取图像源并将其设置为变量。

Answer 1

只要脚本位于img之后，那么:

var youtubeimgsrc = document.getElementById("youtubeimg").src;

参见getElementById在 DOM 规范中。

如果脚本位于img之前，那么img当然还不存在，并且这不起作用。这就是许多人建议将脚本放在 body 元素末尾的原因之一。

<小时/>

旁注:在您的情况下这并不重要，因为您使用了绝对 URL，但如果您在属性中使用了相对 URL，如下所示:

<img id="foo" src="/images/example.png">

...src 反射属性将是已解析 URL，即变成的绝对 URL。因此，如果该内容位于 http://www.example.com 页面上，document.getElementById("foo").src 将为您提供 "http://www.example.com/images/example.png".

如果您想要 src 属性的内容按原样而不被解析，则可以使用 getAttribute 代替: document. getElementById("foo").getAttribute("src")。这将为您提供 "/images/example.png" 以及我上面的示例。

如果您有一个绝对网址(如您问题中的网址)，则没关系。