為什么我在JavaScript中將意外令牌變成非法？

Question

為什么在此腳本中出現錯誤“意外令牌非法”？ 該腳本應檢索所有cookie並在表中顯示其名稱和值。 該錯誤發生在具有開頭表格標簽的行上。

document.getElementById("showCookies").onclick = function(){

        var columnRight = document.getElementById('columnRight');

        var cookies = document.cookie;
        var cookiesContent = '<h1>Existing Cookies</h1>';
        console.log(cookies);
        cookies = cookies.split(";");

        if(cookies.length > 0){

            cookiesContent += '<table width="30%" cellspacing="1" cellpadding="10" border="0">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Value</th>
                </tr>
            </thead>
            <tbody>
                ';

            for(var i = 0; i < cookies.length; i++){

                cookieAtts = cookies[i].split('=');
                cookiesContent += "<tr><td>" + cookieAtts[0] + "</td><td>" + cookieAtts[1] + "</td></tr>";

            }

            cookiesContent += "</tbody></table>";

        }

        columnRight.innerHTML = cookiesContent;

        return false;
    }

Answer 1

使用字符串串聯定義長字符串：

cookiesContent += '<table width="30%" cellspacing="1" cellpadding="10" border="0">' +
            '<thead>'+
                '<tr>' +
                    '<th>Name</th>'+
                    '<th>Value</th>'+
                '</tr>'+
            '</thead>'+
            '<tbody>';

Answer 2

這是因為JavaScript中沒有反斜杠就不能包含多行字符串：

cookiesContent += '<table width="30%" cellspacing="1" cellpadding="10" border="0"> \
            <thead> \
                <tr> \
                    <th>Name</th> \
                    <th>Value</th> \
                </tr> \
            </thead> \
            <tbody> \
                ';

Answer 3

您在字符串中使用<thead...換行了，這是不允許的

Answer 4

串聯起來：

cookiesContent += '<table width="30%" cellspacing="1" cellpadding="10" border="0">' +
        '<thead> ' +
            '<tr> ' +
                '<th>Name</th>' +
                '<th>Value</th>' +
            '</tr>' +
        '</thead>' +
        '<tbody>';

或在同一行中：

cookiesContent += '<table width="30%" cellspacing="1" cellpadding="10" border="0"><thead><tr><th>Name</th><th>Value</th></tr></thead><tbody>';