Почему мой javascript не распознает строки, в которых есть разрывы строк? [Дубликат]

Вы можете сделать это ...

var string = 'This is\n' +
'a multiline\n' + 
'string';

Я думаю, что это обходное решение должно работать в IE, Chrome, Firefox, Safari, Opera -

Использование jQuery:

<xmp id="unique_id" style="display:none;">
  Some plain text
  Both type of quotes :  " ' " And  ' " '
  JS Code : alert("Hello World");
  HTML Code : <div class="some_class"></div>
</xmp>
<script>
   alert($('#unique_id').html());
</script>

Использование Pure Javascript:

<xmp id="unique_id" style="display:none;">
  Some plain text
  Both type of quotes :  " ' " And  ' " '
  JS Code : alert("Hello World");
  HTML Code : <div class="some_class"></div>
</xmp>
<script>
   alert(document.getElementById('unique_id').innerHTML);
</script>

Приветствия !!

Просто попробовал анонимный ответ и нашел здесь небольшой трюк, он не работает, если после обратного слэша есть пробел \. Так что следующее решение не работает -

var x = { test:'<?xml version="1.0"?>\ <-- One space here
            <?mso-application progid="Excel.Sheet"?>' 
};

Но когда пространство удалено, он работает -

var x = { test:'<?xml version="1.0"?>\<-- No space here now
          <?mso-application progid="Excel.Sheet"?>' 
};

alert(x.test);​

Надеюсь, что это поможет !!

Если вы работаете только в узле, вы можете использовать модуль fs для чтения в многострочной строке из файла:

var diagram;
var fs = require('fs');
fs.readFile( __dirname + '/diagram.txt', function (err, data) {
  if (err) {
    throw err; 
  }
  diagram = data.toString();
});

Моя версия соединения на основе массива для строки concat:

var c = []; //c stands for content
c.push("<div id='thisDiv' style='left:10px'></div>");
c.push("<div onclick='showDo(\'something\');'></div>");
$(body).append(c.join('\n'));

Это сработало хорошо для меня, тем более, что я часто вставляю значения в html, построенный таким образом. Но у него много ограничений. Отступы были бы приятными. Не иметь дело с вложенными кавычками, было бы очень приятно, и только громоздкость этого меня беспокоила.

Является ли .push () для добавления в массив, занимающий много времени? См. Этот ответ:

( Есть ли причина, по которой разработчики JavaScript не используют Array.push ()? )

После просмотра этих (противоположных ), похоже, что .push () отлично подходит для строковых массивов, которые вряд ли будут расти более чем на 100 элементов - я избегу его в пользу индексированных добавлений для больших массивов.

Обновление:

Как упоминается в первом ответе, с ES6 / Babel вы можете теперь создавать многострочные строки просто с помощью обратных ссылок:

const htmlString = `Say hello to 
multi-line
strings!`;

Интерполирующие переменные являются популярная новая функция, которая поставляется с строками с разделителями обратной ссылки:

const htmlString = `${user.name} liked your post about strings`;

Это просто переходит к конкатенации:

user.name + ' liked your post about strings'

Оригинальный ответ ES5:

Руководство по стилю JavaScript в стиле Google рекомендует использовать конкатенацию строк вместо экранирования строк:

Не делайте этого:

var myString = 'A rather long string of English text, an error message \
                actually that just keeps going and going -- an error \
                message to make the Energizer bunny blush (right through \
                those Schwarzenegger shades)! Where was I? Oh yes, \
                you\'ve got an error and all the extraneous whitespace is \
                just gravy.  Have a nice day.';

Пробелы на начало каждой строки не может быть безопасно удалено во время компиляции; пробел после косой черты приведет к сложным ошибкам; и в то время как большинство движков сценариев поддерживают это, оно не является частью ECMAScript.

Вместо этого используйте конкатенацию строк:

var myString = 'A rather long string of English text, an error message ' +
               'actually that just keeps going and going -- an error ' +
               'message to make the Energizer bunny blush (right through ' +
               'those Schwarzenegger shades)! Where was I? Oh yes, ' +
               'you\'ve got an error and all the extraneous whitespace is ' +
               'just gravy.  Have a nice day.';

ES6 позволяет использовать обратную линию для указания строки на нескольких строках. Это называется листом шаблона. Пример:

var multilineString = `One line of text
    second line of text
    third line of text
    fourth line of text`;

Использование backtick работает в NodeJS и поддерживается Chrome, Firefox, Edge, Safari и Opera.

https: // разработчик .mozilla.org / EN-US / Docs / Web / JavaScript / Справка / Template_literals

Способ ES6 для этого был бы с использованием литералов шаблона

const str = `${This 


is 


a


multiline text}` ; 

console.log(str);

Использование тегов скриптов:

• добавить блок <script>...</script>, содержащий ваш многострочный текст в тег head;
• получить ваш многострочный текст как есть ... ( следить за кодировкой текста: UTF-8, ASCII)

  <script>
  
      // pure javascript
      var text = document.getElementById("mySoapMessage").innerHTML ;
  
      // using JQuery's document ready for safety
      $(document).ready(function() {
  
          var text = $("#mySoapMessage").html(); 
  
      });
  
  </script>
  
  <script id="mySoapMessage" type="text/plain">
  
      <soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:typ="...">
         <soapenv:Header/>
         <soapenv:Body>
            <typ:getConvocadosElement>
               ...
            </typ:getConvocadosElement>
         </soapenv:Body>
      </soapenv:Envelope>
  
      <!-- this comment will be present on your string -->
      //uh-oh, javascript comments...  SOAP request will fail 
  
  
  </script>
  

Эквивалент в javascript:

var text = `
This
Is
A
Multiline
String
`;

Вот спецификация . См. Поддержку браузера внизу этой страницы . Вот некоторые примеры .

Я придумал этот очень сложный метод многострочной строки. Поскольку преобразование функции в строку также возвращает любые комментарии внутри функции, вы можете использовать комментарии в качестве своей строки, используя многострочный комментарий / ** /. Вам просто нужно обрезать концы, и у вас есть строка.

var myString = function(){/*
    This is some
    awesome multi-lined
    string using a comment 
    inside a function 
    returned as a string.
    Enjoy the jimmy rigged code.
*/}.toString().slice(14,-3)

alert(myString)

Эта библиотека делает ее красивой:

https://github.com/sindresorhus/multiline

До

var str = '' +
'<!doctype html>' +
'<html>' +
'   <body>' +
'       <h1>❤ unicorns</h1>' +
'   </body>' +
'</html>' +
'';

После

var str = multiline(function(){/*
<!doctype html>
<html>
    <body>
        <h1>❤ unicorns</h1>
    </body>
</html>
*/});

Обновлено до 2015 года: сейчас прошло шесть лет: большинство людей используют загрузчик модулей, а в основных модульных системах есть способы загрузки шаблонов. Это не встроенный, но наиболее распространенным типом многострочной строки являются шаблоны, и в любом случае шаблоны вообще не должны содержать JS.

require.js: «требуется текст».

Использование require.js 'text' plugin , с многострочным шаблоном в template.html

var template = require('text!template.html')

NPM / браузер: модуль 'brfs'

Browserify использует модуль «brfs» для загрузки текстовых файлов. Это фактически построит ваш шаблон в вашем комплекте HTML.

var fs = require("fs");
var template = fs.readFileSync(template.html', 'utf8');

Легко.

Downvoters: этот код предоставляется только для информации.

Это было протестировано в Fx 19 и Chrome 24 на Mac

DEMO

var new_comment; /*<<<EOF 
    <li class="photobooth-comment">
       <span class="username">
          <a href="#">You</a>
       </span>
       <span class="comment-text">
          $text
       </span>
       <span class="comment-time">
          2d
       </span>
    </li>
EOF*/
// note the script tag here is hardcoded as the FIRST tag 
new_comment=document.currentScript.innerHTML.split("EOF")[1]; 
alert(new_comment.replace('$text','Here goes some text'));

Вы можете использовать += для объединения вашей строки, кажется, никто не ответил на это, что будет читаемым, а также аккуратным ... что-то вроде этого

var hello = 'hello' +
            'world' +
            'blah';

также может быть записано как

var hello = 'hello';
    hello += ' world';
    hello += ' blah';

console.log(hello);

шаблон text = <<"HERE" This Is A Multiline String HERE недоступен в js (я помню, как много использовал его в своих добрых старых днях Perl).

Чтобы контролировать работу сложных или длинных многострочных строк, я иногда использую шаблон массива:

var myString = 
   ['<div id="someId">',
    'some content<br />',
    '<a href="#someRef">someRefTxt</a>',
    '</div>'
   ].join('\n');

или анонимный шаблон уже показал (escape newline), который может быть уродливым блоком в вашем коде:

    var myString = 
       '<div id="someId"> \
some content<br /> \
<a href="#someRef">someRefTxt</a> \
</div>';

Вот еще один странный, но работающий «трюк» 1 :

var myString = (function () {/*
   <div id="someId">
     some content<br />
     <a href="#someRef">someRefTxt</a>
    </div>        
*/}).toString().match(/[^]*\/\*([^]*)\*\/\}$/)[1];

внешнее редактирование: jsfiddle

[ дополнение 2015 ] ES6 поддерживает привязку строк к нескольким строкам с использованием строк шаблона :

let str = `This is a text
    with multiple lines.
    Escapes are interpreted,
    \n is a newline.`;
let str = String.raw`This is a text
    with multiple lines.
    Escapes are not interpreted,
    \n is not a newline.`;

1 Примечание: это будет потеряно после минификсации / обфускации ваш код

Я удивлен, что не видел этого, потому что он работает везде, где я его тестировал, и очень полезен, например. templates:

<script type="bogus" id="multi">
    My
    multiline
    string
</script>
<script>
    alert($('#multi').html());
</script>

Знает ли кто-нибудь об окружающей среде, где есть HTML, но это не работает?

Пожалуйста, любите использование конкатенации использования Интернета и не используйте для этого решения ES6. ES6 НЕ поддерживается по всем направлениям, подобно CSS3, и некоторые браузеры медленно адаптируются к движению CSS3. Используйте plain ol 'JavaScript, ваши конечные пользователи будут вам благодарны.

Пример:

var str = "This world is neither flat nor round. "+ "Once was lost will be found";

Также обратите внимание, что при расширении строки по нескольким строкам, используя обратную косую черту в конце каждой строки, любые дополнительные символы (в основном пробелы, вкладки и комментарии, добавленные по ошибке) после обратной косой черты вызовут неожиданную ошибку символа, час, чтобы узнать

var string = "line1\  // comment, space or tabs here raise error
line2";

Мне нравится этот синтаксис и отступ:

string = 'my long string...\n'
       + 'continue here\n'
       + 'and here.';

(но на самом деле нельзя рассматривать как многострочную строку)

Если вы хотите использовать экранированные строки новой строки, их можно использовать красиво . Он выглядит как документ со страничной границей.

[/g1]

Вы должны использовать оператор конкатенации «+».

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <p id="demo"></p>
    <script>
        var str = "This "
                + "\n<br>is "
                + "\n<br>multiline "
                + "\n<br>string.";
        document.getElementById("demo").innerHTML = str;
     </script>
</body>
</html>

Используя \n, ваш исходный код будет выглядеть так:

This 
 <br>is
 <br>multiline
 <br>string.

Используя <br> ваш вывод будет выглядеть так:

This
is
multiline
string.

Вы можете использовать TypeScript (JavaScript SuperSet), он поддерживает многострочные строки и переводит обратно на чистый JavaScript без накладных расходов:

var templates = {
    myString: `this is
a multiline
string` 
}

alert(templates.myString);

Если вы хотите выполните это с помощью обычного JavaScript:

var templates = 
{
 myString: function(){/*
    This is some
    awesome multi-lined
    string using a comment 
    inside a function 
    returned as a string.
    Enjoy the jimmy rigged code.
*/}.toString().slice(14,-3)

}
alert(templates.myString)

Обратите внимание, что iPad / Safari не поддерживает 'functionName.toString()'

Если у вас много устаревшего кода, вы также можете использовать простой вариант JavaScript в TypeScript (для целей очистки):

interface externTemplates
{
    myString:string;
}

declare var templates:externTemplates;

alert(templates.myString)

, и вы можете использовать объект многострочной строки из простого варианта JavaScript, где вы помещаете шаблоны в другой файл (который вы можете объединить в пучок).

Вы можете попробовать TypeScript в http://www.typescriptlang.org/Playground

Это работает в IE, Safari, Chrome и Firefox:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<div class="crazy_idea" thorn_in_my_side='<table  border="0">
                        <tr>
                            <td ><span class="mlayouttablecellsdynamic">PACKAGE price $65.00</span></td>
                        </tr>
                    </table>'></div>
<script type="text/javascript">
    alert($(".crazy_idea").attr("thorn_in_my_side"));
</script>

Существует несколько способов достижения этого

1. Конкатенация слэш

  var MultiLine=  '1\
    2\
    3\
    4\
    5\
    6\
    7\
    8\
    9';

2. регулярная конкатенация

var MultiLine = '1'
+'2'
+'3'
+'4'
+'5';

3. Array Присоединиться к конкатенации

var MultiLine = [
'1',
'2',
'3',
'4',
'5'
].join('');

Производительность, кратность конкатенации (первая) является самой быстрой.

См. этот тестовый пример для получения более подробной информации о производительности

Обновление:

С ES2015 мы можем воспользоваться функцией Template strings. С его помощью нам просто нужно использовать обратные тики для создания многострочных строк

Пример:

 `<h1>{{title}}</h1>
  <h2>{{hero.name}} details!</h2>
  <div><label>id: </label>{{hero.id}}</div>
  <div><label>name: </label>{{hero.name}}</div>
  `

Вы можете иметь многострочные строки в чистом JavaScript.

Этот метод основан на сериализации функций, которые определены как зависящие от реализации . Он работает в большинстве браузеров (см. Ниже), но нет гарантии, что он все равно будет работать в будущем, поэтому не полагайтесь на него.

Используя следующую функцию:

function hereDoc(f) {
  return f.toString().
      replace(/^[^\/]+\/\*!?/, '').
      replace(/\*\/[^\/]+$/, '');
}

У вас могут быть следующие документы:

var tennysonQuote = hereDoc(function() {/*!
  Theirs not to make reply,
  Theirs not to reason why,
  Theirs but to do and die
*/});

Метод успешно протестирован в следующих браузерах (не упоминается = не проверен):

• IE 4 - 10
• Opera 9.50 - 12 (не в 9 -)
• Safari 4 - 6 (не в 3 -)
• Chrome 1 - 45
• Firefox 17 - 21 ( не в 16 - )
• Rekonq 0.7.0 - 0.8.0
• Not поддерживается в Konqueror 4.7.4

Будьте осторожны с вашим мини-усилителем. Он имеет тенденцию удалять комментарии. Для компрессора YUI будет сохранен комментарий, начинающийся с /*! (например, тот, который я использовал).

Я думаю, что решение real было бы использовать CoffeeScript .