Javascript - 页面未显示

Question

我有问题。我的页面没有显示，每次我在浏览器上运行它，即Chrome，我的浏览器都会滞后。这是我第一次写一个纯javascript生成的页面。实际上这是我的一个主题的要求。

以下是要求; *“将调查内容JSON文件解析为java脚本对象和 *使用javascript代码显示解析的对象。（我花了差不多一天做这部分） *实现应用程序缓存（完成此操作）

这是我的javascript代码。

window.onload = function(){
    generatePage();
}

function generatePage(){

    //for the WRAPPER
    var wrapperDiv = document.createElement("div");
    wrapperDiv.setAttribute("class","wrapper");

    //for the HEADER
    var headerDiv = document.createElement("div");
    headerDiv.setAttribute("class","header");

    var headImg = document.createElement("img");
    headImg.setAttribute("id","headerImage");
    headImg.src = "styles/Images/survey.png";

    var headTxt = document.createTextNode("Welcome Agent: ");

    //HEADER SPAN
    var header = document.createElement("div");
    header.setAttribute("id","text");
    header.appendChild(headTxt);

    //DATE DIV INSIDE HEADER
    var dateDiv = document.createElement("div");
    dateDiv.setAttribute("id","date");
    var months = new Array("January","February","March","April", "May", "June", "July", "August", "September", "October", "November", "December");
    var days = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday");
    var date = new Date;
    var year = date.getFullYear();
    var month = date.getMonth();
    var day = date.getDay();
    var space = " ";
    var dateResult = days[day]+ "," + months[month] + space + day + space + year;
    var dateText = document.createTextNode(dateResult);
    dateDiv.appendChild(dateText);

    headerDiv.appendChild(headImg);
    headerDiv.appendChild(header);
    headerDiv.appendChild(dateDiv);
    //END: HEADER DIV

    //MENU DIV
    var menuDiv = document.createElement("div");
    menuDiv.setAttribute("class","menu");
    var menu = new Array("Home","Survey","Results");
    for (var x=0;  x< menu.length; x++){
        var link = document.createElement("a");
        link.setAttribute("id","link");

        if(x=1){
            // link.onclick = addSurveyContent();
        }

        var linkText = document.createTextNode(menu[x]);
        link.appendChild(linkText);

        menuDiv.appendChild(link);
    }

    //CONTENT DIV
    var contentDiv = document.createElement("div");
    contentDiv.setAttribute("id","content");
    var questionDiv = document.createElement("div");
    questionDiv.setAttribute("id","question");
    var answerDiv = document.createElement("radio");
    answerDiv.setAttribute("id","radio");

    questionDiv.appendChild(answerDiv);
    contentDiv.appendChild(questionDiv);
    wrapperDiv.appendChild(headerDiv);
    wrapperDiv.appendChild(menuDiv); 
    wrapperDiv.appendChild(contentDiv);
    document.body.appendChild(wrapperDiv);  
}

function addSurveyContent(){
    var request = new XMLHttpRequest();
    request.onreadystatechange = function(){
        if(request.readyState ==4){
            var jsonObj = JSON.parse(request.responseText);

                //printing question
                for(var x=0; x < jsonObj.questions.length; x++){
                    var currQuestObj = jsonObj.questions[x].question;
                    //print before stringify
                    console.log(currQuestObj);
                    var question = JSON.stringify(currQuestObj);
                    //print after stringify
                    console.log(question);
                    document.document.getElementById("question").appendChild(question);
                    //printing radio buttons
                    for(var y=0; y < jsonObj.questions[x].Choices.length; y++){
                        var currChoiceObj = jsonObj.questions[x].Choices[y];
                        //print after stringify
                        var radioBtnName = JSON.stringify(currChoiceObj);
                        //print before stringify
                        var radioBtn = document.createElement("input");
                        radioBtn.addAttribute("type","radio");
                        radioBtn.addAttribute("name",jsonObj.questions[x].question);

                        var radioLabel = document.createElement("label");
                        radioLabel.appendChild(radioBtn);
                        radioLabel.innerHTML += radioBtnName;           
                    }
                }   
        }

    };

    request.open("GET", "surveys/WorkingStudent.json", true);
    request.send();
}

这是我的JSON文件

 {
"name" : "Phone Preference",
"noOfQuestions" : 3,
"questions" :  [
    {   "type"      :  "s",
        "question"  :  "What is your gender?",
        "Choices"   :  ["Male", "Female"]

    },

    {   "type"      :  "s",
        "question"  :  "What is your age?",
        "Choices"   :  ["10-12", "13-15", "16-18", "19 above"]
    },

    {   "type"      :  "m",
        "question"  :  "What is your phone preference?",
        "Choices"   :  ["Samsung", "Nokia", "Blackberry", "iPhone", "Sony", "LG", "HTC", "Others"]
    }
]
}

这是HTML文件

    <!doctype html>
<html manifest="survey.manifest" type="text/cache-manifest">
<head>
    <title>Offline Survey Application</title>
    <link rel="stylesheet" href="styles/survey.css" type="text/css">
    <script type="text/javascript" src="scripts/survey.js"></script>
</head>
<body>
</body>
</html>