4

我想知道这是否可行，如果可以，我有一个长字符串，出于可维护性和可读性的目的，我想将换行符放入代码中，如下所示：

slices += 
    '<div 
        class="'+settings.sliceClass+'"
        style="
            width:' + slicewidth + 'px;
            height:' + sliceheight + 'px;
            left:' + left + 'px;
            top:' + top + 'px;
    "><img src="'+slide.properties.src+'"
        style="
            position: relative;
            left:' + -left + 'px;
            top:' + -top + 'px;
            width:' + Math.round(slide.properties.image.width * slide.properties.scale.width) + 'px;
            height:' + Math.round(slide.properties.image.height * slide.properties.scale.height) + 'px;
    ">
    </img></div>'
);

我不希望这些换行符出现在 HTML 输出中。

但是，这会返回一个SyntaxError: Unexpected EOF.

有没有办法做到这一点？

4

5 回答 5

4

只需在中断每一行之前添加一个反斜杠：

var str = "sfdsadadadas\
           asdasdasdasdasd\
           sdfsdfsfsd";

请记住，每个反斜杠和下一行（缩进）内容之间的空格将是字符串的一部分。<pre>除非您使用预先格式化的文本（如标签中的内容），否则这对 HTML 输出应该不是问题。

于 2012-10-17T20:05:38.627 回答
3

不，字符串不能包含未转义的换行符，只能包含续行符，这意味着您可以在输出字符串中获得缩进空格。规范的操作部分是第 7.8.4 节：

SingleStringCharacter ::
    SourceCharacter but not single-quote or backslash or LineTerminator
  | \ EscapeSequence
  | LineContinuation

“but not ... or LineTerminator”部分表示字符串不能包含换行符，但“| LineContinuation”表示 \ <LineTerminator>是可以的。读入LineContinuation的字符串值表明它对整个引用字符串的字符串值没有贡献，并且不会占用任何前导空格。

你可以做

slices += 
    ['<div', 
       ' class="', settings.sliceClass, '"',
       ' style="',
     ...
    ].join('');

使每一行成为数组中的元素，并加入空字符串。

如果您稍后更改代码以执行更复杂+的数字操作而不仅仅是-left.

于 2012-10-17T20:08:50.047 回答
0

修改代码：。

slices +=       '<div'+
            'class="'+settings.sliceClass+'"'+
            .....

或者你可以求助于数组

 var temp = [
            '<div',
             'class="'+settings.sliceClass+'"',
            ...

           '</img></div>'
  ];
slices  += temp.join("");
于 2012-10-17T20:06:59.050 回答
0

我认为问题是由于使用'（单引号）并在其中"包含（双引号）。所以我会尽量逃避你的报价，喜欢这样：

var component = "<div class=\"rounded-border\">" +
    "<p>Sample Content here " + dynamicValue + "</p>" +
    "</div>";

ps 注意+操作符的使用，这个非常有用，保证下一行数据不变，否则可能会有回车或空格。

于 2012-10-17T20:08:19.843 回答
0 
  slices += 
      '<div' +
          'class="'+settings.sliceClass+'"' +
          'style="' +
              'width:' + slicewidth + 'px;' +
              'height:' + sliceheight + 'px;' +
              'left:' + left + 'px;' +
              'top:' + top + 'px;' +
      '">' +
        '<img src="'+slide.properties.src+'"' +
          'style="' +
            'position: relative;' +
              'left:' + -left + 'px;' +
              'top:' + -top + 'px;' +
              'width:' + Math.round(slide.properties.image.width * slide.properties.scale.width) + 'px;' +
              'height:' + Math.round(slide.properties.image.height * slide.properties.scale.height) + 'px;' +
        '" />' +
      '</div>';
于 2012-10-17T20:08:57.283 回答