слишком длинная строка не может быть использована?

Question

<button onClick="submit()">Display</button>
<div id="demo"></div>

<script type="text/javascript">
    function submit() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            //add the title of the table.
            if (xhr.readyState === 4) {
                alert(xhr.response);
                var obj = JSON.parse(xhr.response);
                var texts = '<table width="1132" height="232" border="1" align="center"> \
                          <tr> \
                            <th width="19" height="57" align="center" valign="middle">id</th> \
                            <th width="75" align="center" valign="middle">username</th> \
                            <th width="46" align="center" valign="middle">name</th> \
                            <th width="46" align="center" valign="middle">email</th> \
                            <th width="65" align="center" valign="middle">address</th> \
                            <th width="60" align="center" valign="middle">birthdate</th> \
                            <th width="53" align="center" valign="middle">gender</th> \
                            <th width="46" align="center" valign="middle">phone</th> \
                            <th width="39" align="center" valign="middle">point</th> \
                            <th width="37" align="center" valign="middle">coin</th> \
                            <th width="112" align="center" valign="middle">freshchat_deviceToken</th> \
                            <th width="145" align="center" valign="middle">freshchat_restoreId</th> \
                            <th width="96" align="center" valign="middle">fcm_registration_id</th> \
                            <th width="48" align="center" valign="middle">enable</th> \
                            <th width="36" align="center" valign="middle">app</th> \
                            <th width="66" align="center" valign="middle">provider</th> \
                          </tr>';
                if(obj.length > 0){
                    for(var idx = 0; idx < obj.length; idx++){
                        var id = obj[idx].id;
                        var username = obj[idx].username;
                        var name = obj[idx].name;
                        var email = obj[idx].email;
                        var address = obj[idx].address;
                        var birthDate = obj[idx].birthDate;
                        var gender = obj[idx].gender;
                        var phone = obj[idx].phone;
                        var point = obj[idx].point;
                        var coin = obj[idx].coin;
                        var fresh_dev = obj[idx].freshchat_deviceToken;
                        var fresh_res = obj[idx].freshchat_restoreId;
                        var fcm = obj[idx].fcm_registration_id;
                        var enable = obj[idx].enabled;
                        var app = obj[idx].app;
                        var provider = obj[idx].local;
                        texts += '<tr> \
                            <td>' + (id)?id:"Not ready" + '</td> \
                            <td>' + (username)?username:"Not ready" + '</td> \
                            <td>' + (name)?name:"Not ready" + '</td> \
                            <td>' + (email)?email:"Not ready" + '</td> \
                            <td>' + (address)?address:"Not ready" + '</td> \
                            <td>' + (birthDate)?birthDate:"Not ready" + '</td> \
                            <td>' + (gender)?gender:"Not ready" + '</td> \
                            <td>' + (phone)?phone:"Not ready" + '</td> \
                            <td>' + (point)?point:"Not ready" + '</td> \
                            <td>' + (coin)?coin:"Not ready" + '</td> \
                            <td>' + (fresh_dev)?fresh_dev:"Not ready" + '</td> \
                            <td>' + (fresh_rev)?fresh_rev:"Not ready" + '</td> \
                            <td>' + (fcm)?fcm:"Not ready" + '</td> \
                            <td>' + (enable)?enable:"Not ready" + '</td> \
                            <td>' + (app)?app:"Not ready" + '</td> \
                            <td>' + (provider)?provider:"Not ready" + '</td> \
                          </tr>';
                    }
                }
            texts = texts + '</table>';
            document.getElementById("demo").innerHTML = 'sss'+texts;
        }
    }
        xhr.open("GET", "URL", true);
        xhr.setRequestHeader('Authorization', 'Token');
        xhr.send();
    }
</script>

Что я делаю не так? Я пытаюсь решить этот код в течение 4 часов.Помоги мне, пожалуйста.На консоли нет ошибок.Я думаю, что текстовая строка слишком длинная.но я не знаю, как это решить.Я использовал запрос get для вызова этих значений.

{id   username   name   email   address birthdate   gender  phone   point   coin    freshchat_deviceToken   freshchat_restoreId fcm_registration_id enable  app provider}

и проанализируйте его в JSON

Я изменяю позицию "()", чтобы решить ее, но на этот раз ничего не видно. Обновлено

Answer 1

Решением вашей проблемы является упаковка троичных операторов в (), например:

<td>' + (id ? id:"Not ready") + '</td>

и так далее.Статья по теме здесь .

Answer 2

Вы можете попробовать использовать Jquery

$(table).find('tbody').append(yourhtmlvariable);

Если вы хотите сделать это в javascript, используйте функцию insertRow для добавления новой строки.