Как разбить код из одной строки в несколько на js?

Question

[Павел]

отправляю длиннющую строку по почте на gmail , он ломает отображения письма, если разбить код на несколько не очень длинных строк , все идеально.

Как разбить код или проставить переносы строк правильно чтобы append jquery не делал весь код в одну строку?

Вот что мне выдает jquery после append

сплошная строка html

<div class="results-container"><span>обьект: фыв 1 </span><table border="1" cellpadding="3" cellspacing="1" data-gild-id="0"><thead><tr><td rowspan="2">№ <br> п/п</td><td rowspan="2">ФИО работника</td><td rowspan="2">Профессия</td><td colspan="4">Сроки выполнения работ</td></tr><tr><td>Дата начала работ</td><td>Время начала работ</td><td>Дата окончания работ</td><td>Время окончания работ</td></tr></thead><tbody><tr><td>1</td><td>фыв В.М.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr><tr><td>2</td><td>фыв Е.Ю.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr></tbody></table><div></div><span>обьект: фыв 2 </span><table border="1" cellpadding="3" cellspacing="1" data-gild-id="1"><thead><tr><td rowspan="2">№ <br> п/п</td><td rowspan="2">ФИО работника</td><td rowspan="2">Профессия</td><td colspan="4">Сроки выполнения работ</td></tr><tr><td>Дата начала работ</td><td>Время начала работ</td><td>Дата окончания работ</td><td>Время окончания работ</td></tr></thead><tbody><tr><td>1</td><td>фыв Т.П.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr><tr><td>2</td><td>фыв Н.Ф.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr></tbody></table><div></div><span>обьект: фыв 1 </span><table border="1" cellpadding="3" cellspacing="1" data-gild-id="2"><thead><tr><td rowspan="2">№ <br> п/п</td><td rowspan="2">ФИО работника</td><td rowspan="2">Профессия</td><td colspan="4">Сроки выполнения работ</td></tr><tr><td>Дата начала работ</td><td>Время начала работ</td><td>Дата окончания работ</td><td>Время окончания работ</td></tr></thead><tbody><tr><td>1</td><td>фыв Н.В.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr></tbody></table><div></div><span>обьект: фыв </span><table border="1" cellpadding="3" cellspacing="1" data-gild-id="4"><thead><tr><td rowspan="2">№ <br> п/п</td><td rowspan="2">ФИО работника</td><td rowspan="2">Профессия</td><td colspan="4">Сроки выполнения работ</td></tr><tr><td>Дата начала работ</td><td>Время начала работ</td><td>Дата окончания работ</td><td>Время окончания работ</td></tr></thead><tbody><tr><td>1</td><td>фыв В.М.</td><td>вd><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr><tr><td>2</td><td>фыв С.И.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr></tbody></table><div></div><span>обьект: ССХ </span><table border="1" cellpadding="3" cellspacing="1" data-gild-id="5"><thead><tr><td rowspan="2">№ <br> п/п</td><td rowspan="2">ФИО работника</td><td rowspan="2">Профессия</td><td colspan="4">Сроки выполнения работ</td></tr><tr><td>Дата начала работ</td><td>Время начала работ</td><td>Дата окончания работ</td><td>Время окончания работ</td></tr></thead><tbody><tr><td>1</td><td>фыв А.В.</td><td>Электромонтер</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr></tbody></table><div></div><span>обьект: фыв 1 </span><table border="1" cellpadding="3" cellspacing="1" data-gild-id="6"><thead><tr><td rowspan="2">№ <br> п/п</td><td rowspan="2">ФИО работника</td><td rowspan="2">Профессия</td><td colspan="4">Сроки выполнения работ</td></tr><tr><td>Дата начала работ</td><td>Время начала работ</td><td>Дата окончания работ</td><td>Время окончания работ</td></tr></thead><tbody><tr><td>1</td><td>втромонтер</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr><tr><td>2</td><td>фыв М.С.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr></tbody></table><div></div><span>обьект: фыв </span><table border="1" cellpadding="3" cellspacing="1" data-gild-id="8"><thead><tr><td rowspan="2">№ <br> п/п</td><td rowspan="2">ФИО работника</td><td rowspan="2">Профессия</td><td colspan="4">Сроки выполнения работ</td></tr><tr><td>Дата начала работ</td><td>Время начала работ</td><td>Дата окончания работ</td><td>Время окончания работ</td></tr></thead><tbody><tr><td>1</td><td>фыв А.В.</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr><tr><td>2</td><td>фыв П.А</td><td>фыв</td><td>05.02.2019</td><td>08:00</td><td>05.02.2019</td><td>17:00</td></tr></tbody></table><div></div></div>

Answer 1

[WapSter]

\n перенос, \t табуляция

Comments

[Павел]

а эти символы уже экранированы или их как то скрывать в html надо?

[WapSter]

я не вижу что вы делаете в js, ну в общем если этот код из js генерируется, то они не будут отображаться, а сделают свое назначение.

[Павел]

Тимур Турсунбаев,

tablesContainer.append(
                '<span>обьект: ' + gild.find('input').val() + ' </span>' + 
                '<table border="1" cellpadding="3" cellspacing="1"  data-gild-id="' + i + '">' +
                '<thead>' +
                '<tr>' +
                '<td rowspan="2">№ <br> п/п</td>' +
                '<td rowspan="2">ФИО работника</td>' +
                '<td rowspan="2">Профессия</td>' +
                '<td colspan="4">Сроки выполнения работ</td>' +
                '</tr>' +
                '<tr>' +
                '<td>Дата начала работ</td>' +
                '<td>Время начала работ</td>' +
                '<td>Дата окончания работ</td>' +
                '<td>Время окончания работ</td>' +
                '</tr>' +
                '</thead>' +
                '<tbody>' +
                '</tbody>' +
                '</table>' +
                '<div></div>'
            );

как в моем случае применить? Если вставлю внутрь скобок '' то отображается как текст , если за пределами то ломается код

[WapSter]

Павел,

tablesContainer.append(
  '<span>обьект: ' + gild.find('input').val() + ' </span>\n' +
  '<table border="1" cellpadding="3" cellspacing="1"  data-gild-id="' + i + '">\n' +
  '<thead>\n' +
  '<tr>\n' +
  '<td rowspan="2">№ <br> п/п</td>' +
  '<td rowspan="2">ФИО работника</td>' +
  '<td rowspan="2">Профессия</td>' +
  '<td colspan="4">Сроки выполнения работ</td>\n' +
  '</tr>\n' +
  '<tr>\n' +
  '<td>Дата начала работ</td>' +
  '<td>Время начала работ</td>' +
  '<td>Дата окончания работ</td>' +
  '<td>Время окончания работ</td>\n' +
  '</tr>\n' +
  '</thead>\n' +
  '<tbody>\n' +
  '</tbody>\n' +
  '</table>\n' +
  '<div></div>'
);

[Павел]

Тимур Турсунбаев, да , это решило проблему, 2 дня потратил на то что бы найти в чем конкретно причина, ох чувствую что хакнул gmail ))))

спасибо!

[WapSter]

Павел, пожалуйста)

Answer 2

[Павел Волынцев]

tablesContainer.append([
  '<span>обьект: ' + gild.find('input').val() + ' </span>',
  '<table border="1" cellpadding="3" cellspacing="1"  data-gild-id="' + i + '">',
  '<thead>',
  '<tr>',
  '<td rowspan="2">№ <br> п/п</td>',
  '<td rowspan="2">ФИО работника</td>',
  '<td rowspan="2">Профессия</td>',
  '<td colspan="4">Сроки выполнения работ</td>',
  '</tr>',
  '</table>',
  ].join("\n"));