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>が OK であることを意味します。LineContinuationの文字列値を読み取ると、全体として引用符で囲まれた文字列の文字列値に寄与せず、先頭の空白を消費しないことがわかります。

できるよ

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

各行を配列の要素にし、空の文字列で結合します。

これは、+後でコードを変更して-left.

于 2012-10-17T20:08:50.047 に答える
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 に答える
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+'"'+
            .....

または、配列の助けを借りることができます

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

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