1

我正在编写我的第一个程序以在 Google chrome 中进行扩展,我只是从这里以“hello world”教程为例

这是我的 html 文件源代码:

<!doctype html>
<html>
<head>
  <title>Getting Started Extension's Popup</title>
  <style>
    body {
      min-width:357px;
      overflow-x:hidden;
    }

    img {
      margin:5px;
      border:2px solid black;
      vertical-align:middle;
      width:75px;
      height:75px;
    }
  </style>

  <!-- JavaScript and HTML must be in separate files for security. -->
  <script src="popup.js"></script>
</head>
<body>
</body>
</html>

广告这是我的 javascript 文件源代码:

var req = new XMLHttpRequest();
req.open(
    "GET",
    "http://api.flickr.com/services/rest/?" +
    "method=flickr.photos.search&" +
    "api_key=90485e931f687a9b9c2a66bf58a3861a&" +
    "text=hello%20world&" +
    "safe_search=1&" +  // 1 is "safe"
    "content_type=1&" +  // 1 is "photos only"
    "sort=relevance&" +  // another good one is "interestingness-desc"
    "per_page=20",
true);
req.onload = showPhotos;
req.send(null);

function showPhotos() {
   var photos = req.responseXML.getElementsByTagName("photo");

   var element = document.createElement('h1');
   element.appendChild(document.createTextNode 
   ('tete '+document.location.href+'hgdfhgd'));

   for (var i = 0, photo; photo = photos[i]; i++) {
   var img = document.createElement("image");
   img.src = constructImageURL(photo);
   document.body.appendChild(img);
 }
}

// See: http://www.flickr.com/services/api/misc.urls.html
function constructImageURL(photo) {
   return "http://farm" + photo.getAttribute("farm") +
  ".static.flickr.com/" + photo.getAttribute("server") +
  "/" + photo.getAttribute("id") +
  "_" + photo.getAttribute("secret") +
  "_s.jpg";
}

该示例非常简单并且工作正常,但是当添加我自己的 javascript 指令时,它不显示它,添加的指令在 showPhotos() 函数中,它是:

   var element = document.createElement('h1');
   element.appendChild(document.createTextNode 
   ('tete '+document.location.href+'hgdfhgd'));

结果,我可以看到其他内容,但我的“h1”我看不到。我错过了什么?谁能帮帮我?

谢谢

4

1 回答 1

2

您正在创建一个元素,但没有将其添加到页面中。所以是看不出来的。

您可以看到它添加它,例如这样:

var element = document.createElement('h1');
element.appendChild(document.createTextNode ('tete '+document.location.href+'hgdfhgd'));
document.body.appendChild(element);
于 2012-06-06T15:46:13.293 回答