Почему пробелы влияют на JavaScript в моих HTML-элементах?

Question

Я перебираю объект JSON, получаю данные и создаю строку в таблице.Однако, когда я не ставлю пробелы, когда добавляю строки, т.е. я делаю это только одной строкой, это работает.пространства.Это распадается.Я не понимаю!

for(var i in data.students)
{    
    table += 
        '<tr>
            <td id="studentName">' + data.students[i].firstname + ' ' + data.students[i].lastname +'</td>
            <td>
                <select class="attendSelect" id="studentSelect'+ data.students[i].lastname +'">
                    <option value="Attended">Attended</option>
                    <option value="Excused">Excused</option>
                    <option value="Absent">Did not Attend</option>
                </select>
            </td>
        </tr>';
}

Answer 1

Вы не можете просто добавить возврат строк внутри строк. Вы можете сделать это одним из двух способов:

var mystring = "this" + 
               "is multi" + 
               "line";

или

var mystring = "this \ 
               is multi \
               line";

Обратите внимание, что эти две строки не равны. Первый пример не имеет пробела между строками. Во 2-м примере все пробелы находятся в начале строк в строке.

Answer 2

Так думает компилятор just time.

Добавляйте \ в конце каждой строки в «строке»

Answer 3

Не используйте \ для фальсификации многострочных строк в javascript, как предлагали другие.

str = "this \
       is a multiline \ 
       string";


str = "this \
       is a multiline \
       string";

В одной из этих строк есть синтаксическая ошибка, которая вызовет исключение, можете ли вы сказать, что, глядя на них?

Использование \ просто вызывает кошмар отладки.Придерживайтесь конкатенации строк (+) или интерполяции с использованием одной из множества систем шаблонов, таких как руль или подчеркивание или даже шаблонизатор jQuery.

Answer 4

Это потому, что JavaScript вставляет ; автоматически в конец вашей строки, что разрывает вашу строку, потому что она не определена.Вы можете экранировать конец строки с помощью \ или правильно закрыть строку в конце строки, что является более подробным и менее подверженным ошибкам:

for(var i in data.students)
{    
    table += '<tr>' +
            '<td id="studentName">' + data.students[i].firstname + ' ' + data.students[i].lastname +'</td>' +
            '<td>'
                '<select class="attendSelect" id="studentSelect' + 
                  data.students[i].lastname +'">' +
                    '<option value="Attended">Attended</option>' +
                    '<option value="Excused">Excused</option>' +
                    '<option value="Absent">Did not Attend</option>' +
                '</select>' +
            '</td>' +
        '</tr>';
}