chrome dev工具在初始化调用期间崩溃

时间:2018-04-20 00:30:49

标签: javascript html jsonp iife

以下代码在此行document.body.appendChild(script);上崩溃,新脚本被添加到body元素中。页面崩溃,浏览器的调试工具显示此消息DevTools was disconnected from the page. Once page is reloaded, DevTools will automatically reconnect。我不确定导致调试器工具崩溃的错误是什么,因为添加和删除脚本以获取随机引用的同一过程与#btn-quote点击事件一起使用。通过将appController.init();替换为window.onload = init;,我还尝试在加载页面时调用init函数,但仍然出现相同的错误。我真的很感激,任何人都可以指出我在下面的代码中做出的任何逻辑错误,因为我无法解决它们。

var dataController = (function() {
    var data = {
        quote: '',
        author: ''
    }
    function setRandomQuote() {
        var script = document.createElement('script'); 
        script.src = 'http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=parseQuote'; 
        document.body.appendChild(script);

        window.parseQuote= function(json) {
            data.quote = json.quoteText;
            data.author = json.quoteAuthor;
        }
        script.parentNode.removeChild(script);
    }
    return {
        getQuote: function() {
            setRandomQuote();
            return data;
        }
    };
})();


var UIController = (function(){

    return {
        changeQuote: function(data) {
            document.querySelector('q').innerHTML = data.quote;
            document.querySelector('cite').innerHTML = data.author;
        }
    }
})();


var appController = (function(dataCtrl, UICtrl) {
    var setupEventListener = function() {
        document.querySelector('#btn-quote').addEventListener('click', getRandomQuote);
    };

    function getRandomQuote() {
        var data= {};
        // 1. get quote
        var data = dataCtrl.getQuote();


        // 2. change UI with new quote
       UICtrl.changeQuote(data);
    }

    return {
        init: function() {
            setupEventListener();
            getRandomQuote();
        }
    }

})(dataController, UIController); 


appController.init();

0 个答案:

没有答案