如何在JavaScript

时间:2016-03-18 07:34:22

标签: javascript html

我正在尝试创建一个Chrome扩展程序,该扩展程序使用Aylien Summarizer API来汇总当前网页。我使用当前选项卡的权限创建了清单。我有一个popup.html,它是扩展图标的显示和它创建的按钮。然后我有一个popup.js,其中包含API的所有逻辑和调用。我无法弄清楚如何使用我正在使用的API以及如何显示它返回的数据。我正在考虑创建一个表单并用API返回的句子填充它。

这是我使用的API的文档:http://docs.aylien.com/docs/summarize

Popup.html

<!doctype html>
<html>
  <head>
    <title>Aylien Summarizer</title>
    <script src="popup.js"></script>
  </head>
  <body>
    <h1>Aylien Summarizer</h1>
    <input type="button" onclick="summarizeNow()" value="Summarize now!"/>
  </body>
</html>

Popup.js

function summarizeNow() {
    var AYLIENTextAPI = require('aylien_textapi');
    var textapi = new AYLIENTextAPI({
    application_id: "12049eaa",
    application_key: "0050eee15d54ac3dbd69d868fc1e8570"

    var current = window.location.href 

    textapi.summarize({
      url: 'current',
      sentences_number: 5
    }, function(error, response) {
      if (error === null) {
        response.sentences.forEach(function(s) {
          console.log(s);
        });
      }
    });
    });
}

所以我考虑将这个添加到上面的foreach循环中:

var f = document.createElement("form");
f.appendChild(s);

1 个答案:

答案 0 :(得分:0)

在HTML中添加div:

<!doctype html>
<html>
  <head>
    <title>Aylien Summarizer</title>
    <script src="popup.js"></script>
  </head>
  <body>
    <h1>Aylien Summarizer</h1>
    <input type="button" onclick="summarizeNow()" value="Summarize now!"/>
    <div id="summary"></div>
  </body>
</html>

并在循环中追加到:

function summarizeNow() {
    var AYLIENTextAPI = require('aylien_textapi');
    var textapi = new AYLIENTextAPI({
    application_id: "12049eaa",
    application_key: "0050eee15d54ac3dbd69d868fc1e8570"

    var current = window.location.href
    var sum = document.getElementById("summary"); 

    textapi.summarize({
      url: 'current',
      sentences_number: 5
    }, function(error, response) {
      if (error === null) {
        response.sentences.forEach(function(s) {
        sum.innerHTML = sum.innerHTML + s;
        });
      }
    });
    });
}