форматирование строк jQuery, которые должны охватить несколько строк
Вы могли записать свою собственную функцию для обеспечения подобного результата. Посмотрите раздел newConfim здесь: http://www.webreference.com/dhtml/column22/js-vbNewjs.html
5 ответов
Добавьте \ в конце каждой строки
$("#theObject").doSomething()
.append("
<div>\
<div>\
Hello World\
</div>\
</div>\
")
Edit 2016:
Если вы используете ES6 (ES2015), теперь вы можете использовать литералы шаблона .
$("#theObject")
.doSomething()
.append(
"<div>"
+"<div>"
+"Hello World"
+"</div>"
+"</div>"
);
Лучше всего загружать содержимое .append () как переменную, например:
var append_me =
"<div>"
+"<div>"
+"Hello World"
+"</div>"
+"</div>";
$("#theObject").doSomething().append(append_me);
Не существует элегантного способа представить красивую древовидную структуру HTML в Javascript с помощью строк. Вам просто нужно будет использовать кучу конкатенации, которая всегда будет некрасивой, и могу я добавить, что она работает ужасно. Вот что я делаю:
- Записываю мою разметку в моем любимом редакторе со всеми желаемыми пробелами
- Сохраняю ее в том же месте, что и ваш JS-файл, с тем же именем + ".txt", что и расширение
- В моем редакторе есть функция поиска и замены с помощью RegEx, поэтому я выполняю замену всего на что-то вроде
> [\ s] * < - Скопируйте однострочный результат в мой файл Javascript в виде строковой переменной
- Отменить замену в файле .txt
Это, конечно, подразумевает, что каждый раз, когда вы меняете разметку, вам нужно будет повторно выполнить замену и скопировать ее. Однако я довольно быстро приобрел эту привычку. Кроме того, jQuery сможет обработать это быстрее, потому что будет меньше символов для синтаксического анализа.
var str = '<div>';
str += '<div>';
str += 'Hello World';
$("#theObject")
.doSomething()
.append(str)
Если вы используете jQuery и ваши строковые литералы будут элементами html, вы также можете просто создать эти элементы прямо на странице и скрыть их, а затем ссылаться на эти элементы в DOM вместо того, чтобы печатать их как строки. Например, вы можете поместить это на свою страницу:
<div id="myContent" style="display: none;">
<div>
<div>
Hello World
</div>
</div>
</div>
А затем переписать свой код следующим образом:
$("#theObject")
.doSomething()
.append(
$('#myContent').html();
);
В качестве альтернативы вы можете добавить фактический элемент DOM, если вам нужно сослаться на него только один раз, вместо копирования его содержимого каждый раз.