好的,所以我正在尝试制作 Chrome 扩展程序。我在这方面有点菜鸟,这就是为什么我开始从教程站点获取示例扩展并向其中添加内容。我从某个我不记得的网站上得到它,如果你真的想要归属,我可以搜索它。代码:
var req = new XMLHttpRequest();
req.open(
"GET",
"http://api.flickr.com/services/rest/?" +
"method=flickr.photos.search&" +
"api_key=90485e931f687a9b9c2a66bf58a3861a&" +
"text=hello_world&" +
"safe_search=1&" +
"content_type=1&" +
"sort=relevance&" +
"per_page=24",
true);
req.onload = showPhotos;
req.send(null);
function showPhotos() {
var photos = req.responseXML.getElementsByTagName("photo");
for (var i = 0, photo; photo = photos[i]; i++) {
var img = document.createElement("image");
img.src = constructImageURL(photo);
document.getElementById("images").appendChild(img);
}
}
function constructImageURL(photo) {
return "http://farm" + photo.getAttribute("farm") +
".static.flickr.com/" + photo.getAttribute("server") +
"/" + photo.getAttribute("id") +
"_" + photo.getAttribute("secret") +
"_s.jpg";
}
所以无论如何,扩展所做的就是向 Flickr 的 API 发送一个 XMLHttpRequest,获取一些图像(XML 格式的 img 标签)。然后,它使用 for 循环遍历这些标签,并为每个标签使用 createElement() 创建一个新的 img 元素,使用constructImageURL() 函数为其提供一个 src 属性并将其附加到弹出页面。我想做的是让你可以真正点击这些图像,并被带到图像的页面。我试图根据创建图像元素的代码片段制作一段代码,但要创建锚 (a) 元素,并将其添加到 for 循环中。它看起来像这样:
var a = document.createElement("link");
a.href = constructImageURL(photo);
a.target = "_blank";
document.getElementById("images").appendChild(a);
然后我添加了一些代码将 img 元素附加到锚元素,有效地制作了一个<a><img /></a>
结构:
document.a.appendChild(img);
但是,它不起作用。有人可以帮忙吗?