Question

我是Chrome Extension开发的新手，所以请帮助我。

我试图从此网址读取JSON字符串 http://www.roblox.com/catalog/json?Subcategory=16&SortType=3&ResultsPerPage=10

我想在 browser_action.html 弹出窗口上的HTML表格中显示结果。

我知道这是一个非常通用的问题，但如果你可以指导我，它会对我有所帮助。

Answer 1

经过一番浏览后，我找到了W3School

的分步指南

我使用此工具创建模板：Extensionizr

我刚刚将一个Popup.js添加到与browser_action.html

相同的文件夹中

内部Popup.js：

var xmlhttp = new XMLHttpRequest();
var url = "http://www.w3schools.com/website/Customers_MYSQL.php";

xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        myFunction(xmlhttp.responseText);
    }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();

function myFunction(response) {
    var arr = JSON.parse(response);
    var i;
    var out = "<table>";

for(i = 0; i < arr.length; i++) {
    out += "<tr><td>" + 
    arr[i].Name +
    "</td><td>" +
    arr[i].City +
    "</td><td>" +
    arr[i].Country +
    "</td></tr>";
}
out += "</table>";
document.getElementById("id01").innerHTML = out;
}

在browser_action.html内：

<!doctype html>
<style type="text/css">
    #mainPopup {
        padding: 10px;
        height: 200px;
        width: 400px;
        font-family: Helvetica, Ubuntu, Arial, sans-serif;
    }
    h1 {
        font-size: 2em;
    }
</style>
<script src=popup.js></script>

<div id="mainPopup">

<div id="id01"></div>

那就是它:)

如何将外部URL中的JSON字符串加载到Chrome扩展程序

1 个答案: