Question

编辑：包含对JS文件所做的更改（int i = 0更改为var i = 0，返回set在createTH和createTD

HTML FILE（index.html）：

<!DOCTYPE html>
<html>

<head>
    <title>Student Schedules</title>
    <link rel="stylesheet" href="styles.css" type="text/css" />
    <script src="loadfile.js" type="text/javascript"></script>
</head>

<body>
    <!--For some reason there is a reference error stating that getFile() is not defined. The code should work perfectly otherwise.-->
    <input type="button" value="Load Marks" onclick="getFile()" />
    <div id="results">
    </div>
</body>

</html>

JAVASCRIPT FILE（loadfile.js）

function createTH(text) {
    return "<th>" + text + "</th>";
}

function createTD(text) {
    return "<td>" + text + "</td>";
}

function createStudentRow(studentID, givenName, surname, midtermMark, finalExamMark, assignmentsMark, projectMark) {
    htmlTable += "<tr>" + createTD(studentID) + createTD(givenName) + createTD(surname) + createTD(midtermMark) + createTD(finalExamMark) + createTD(assignmentsMark) + createTD(projectMark) + "</tr>";
}

function createHeaderRow() {
    htmlTable += "<tr>" + createTH("Student ID") + createTH("Given Name") + createTH("Surname") + createTH("Midterm Mark") + createTH("Final Exam Mark") + createTH("Assignments Mark") + createTH("Project Mark") + "</tr>";
}

function getFile() {
    htmlTable = "<table>";
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function () {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            loadTable(xhttp);
        }
    }
    xhttp.open("GET", "data_source.xml", true);
    xhttp.send();
}

function loadTable(xml) {
    createHeaderRow();

    var xmlDoc = xml.responseXML;

    var studentRecords = xmlDoc.getElementsByTagName("studentRecord");

    for (var i = 0; i < studentRecords.length; i++) {
        var sID = studentRecords[i].getAttribute("sid");
        var name = studentRecords[i].getAttribute("givenName");
        var surname = studentRecords[i].getAttribute("surname");
        var midterm = studentRecords[i].childNodes[0].getAttribute("mark");
        var final = studentRecords[i].childNodes[1].getAttribute("mark");
        var assignments = studentRecords[i].childNodes[2].getAttribute("mark");
        var project = studentRecords[i].childNodes[3].getAttribute("mark");

        createStudentRow(sID, name, surname, midterm, final, assignments, project);
    }

    htmlTable += "</table>";
    document.getElementById("results").innerHTML = htmlTable;
}

XML FILE（data_source.xml）：

<marks courseCode="csci3230u" semester="fall2015">
    <studentRecord sid="100000001" givenName="Ahmed" surname="Latif">
        <midterm mark="71.25" />
        <finalExam mark="78.5" />
        <assignments mark="18.0" />
        <project mark="22.5" />
    </studentRecord>
    <studentRecord sid="100000002" givenName="Katherine" surname="Schultz">
        <midterm mark="74.75" />
        <finalExam mark="81.0" />
        <assignments mark="19.5" />
        <project mark="24.0" />
    </studentRecord>
    <studentRecord sid="100000003" givenName="Zhilong" surname="Xu">
        <midterm mark="67.25" />
        <finalExam mark="72.75" />
        <assignments mark="17.5" />
        <project mark="23.5" />
    </studentRecord>
    <studentRecord sid="100000004" givenName="Harley" surname="Mackenzie">
        <midterm mark="54.0" />
        <finalExam mark="58.75" />
        <assignments mark="14.5" />
        <project mark="17.5" />
    </studentRecord>
    <studentRecord sid="100000005" givenName="Loic" surname="Montpellier">
        <midterm mark="72.5" />
        <finalExam mark="64.75" />
        <assignments mark="20.0" />
        <project mark="22.0" />
    </studentRecord>
</marks>

当我按下我页面上的按钮时，我在Chrome控制台中收到此错误：

Uncaught SyntaxError：意外的标识符 loadfile.js：36

index.html：12未捕获的ReferenceError：未定义getFile onclick @ index.html:12

有什么想法吗？＆LT; 3

Answer 1

int不是JavaScript中的关键字。

而不是for (int i = 0; i < studentRecords.length; i++)它应该是for (var i = 0; i < studentRecords.length; i++)

参考错误：函数未定义（html / javascript）

1 个答案: