Question

我正在学习通过实现字典api在javascript中使用webAPI。我希望使用文件word从chrome扩展程序的弹出窗口获取变量popup.js中的输入。

问题：我想存储此word并将其传递到另一个文件script.js，该文件包含API调用以搜索此单词的定义并将其返回到extension.js文件以在弹出窗口中显示它。如何实现这个？

我查看的是通过调用包含全局变量声明的文件来使用全局变量，即。第一个extension.js，以某种方式将其执行转移到script.js，然后将结果返回extension.js。如何转移此执行？或者有更简洁的方法吗？此外，还有一种比使用全局变量在两个javascript文件之间传递信息更好的方法。

这些是我到目前为止写的代码 -

popup.html

....
<script type="text/javascript" src="scripts/scripts.js"></script>
<script type="text/javascript" src="scripts/extension.js"></script>
....

scripts.js中

var url = 'http://api.pearson.com/v2/dictionaries/entries?headword=' + word;
var request = new XMLHttpRequest();
request.open('GET', url, true);
request.setRequestHeader('accept', "application/json");

request.onload = function() {
    //Begin accessing JSON data here

    var data = JSON.parse(this.response);
    definition = data.results[0].senses[0].definition;
    definition = definition.charAt(0).toUpperCase() + definition.substr(1);
    console.log(definition);
}

request.send();

extension.js

var word, definition;

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('status').textContent = "Extension loaded";
    var searchButton = document.getElementById('searchButton');

    searchButton.addEventListener('click', function() {
        $('#status').html(definition);

        var word = $('#textInput').val();
        if(!word){
            $('#status').html("Please enter a word");
            return;
        }
    })

    addButton.addEventListener('click', function() {
        $('#status').html('The word is added to the list');
    })
})

任何愿意提供任何建议的人都会非常有帮助。非常感谢任何帮助！

将执行从一个javascript文件转移到另一个javascript文件

0 个答案: