我在Ruby中有以下代码。我想把这段代码转换成JavaScript。JS中的等效代码是什么?

text = <<"HERE"
This
Is
A
Multiline
String
HERE

当前回答

我找到了一个更优雅的解决方案,可能有点与主题无关,因为它使用了PHP,但我相信它对你的一些人来说会很有用和可爱。。。

这个javascript代码应该留在脚本标记中

var html=<?php echo json_encode("

        <div class=container>
            <div class=area1>
                xxx
            </div>
            <div class=area2>
                ".$someVar."
            </div>
        </div>

"); ?>

在输出html中,您将看到类似

var html="\r\n\r\n\t\t\t<div class=container>\r\n\t\t\t\t<div class=area1>\r\n\t\t\t\t\txxx\r\n\t\t\t\t<\/div>\r\n\t\t\t\t<div class=area2>\r\n\t\t\t\t\t44\r\n\t\t\t\t<\/div>\r\n\t\t\t<\/div>\r\n\r\n\t\t";  

 


瞧!,它为您的文件提供了代码可读性。

pD:此示例使用json_encode()PHP函数,但当然也有ASP、Ruby和JSP语言的等效函数。

pD:然而,这个解决方案也有他的局限性,其中之一就是不能在封装的代码中使用javascript变量。

其他回答

使用脚本标记:

添加<script></script>块,其中包含head标记中的多行文本;按原样获取多行文本…(注意文本编码:UTF-8、ASCII)<脚本>//纯javascriptvar text=document.getElementById(“mySoapMessage”).innerHTML;//使用JQuery的文档做好安全准备$(文档).ready(函数){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:getConvocatosElement>...</typ:getConvocatosElement></soapenv:Body></soapenv:信封><!-- 此注释将出现在字符串-->中//呃哦,javascript注释。。。SOAP请求将失败</script>

我的基于数组的字符串连接版本:

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个项目的字符串数组是很好的-我将避免使用它,而支持对较大数组进行索引加法。

您可以使用+=连接字符串,似乎没有人回答,这将是可读的,也很整洁。。。像这样的东西

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

也可以写成

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

console.log(hello);

更新:

ECMAScript6(ES6)引入了一种新的文本类型,即模板文本。它们有很多特性,变量插值等等,但对于这个问题最重要的是,它们可以是多行的。

模板文本由反引号分隔:

var html = `
  <div>
    <span>Some HTML here</span>
  </div>
`;

(注意:我并不主张在字符串中使用HTML)

浏览器支持是可以的,但您可以使用更兼容的转发器。


ES5原始答案:

Javascript没有here文档语法。但是,您可以转义字面换行符,这很接近:

"foo \
bar"

模式text=<<“HERE”这是一个多行字符串HERE在js中是不可用的(我记得在我以前的Perl时代经常使用它)。

为了保持对复杂或长的多行字符串的监督,我有时使用数组模式:

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

或者匿名者已经显示的模式(转义换行符),这可能是代码中的一个丑陋的块:

    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

ES20xx支持使用模板字符串跨多行生成字符串:

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注意:缩小/模糊代码后,这将丢失