如何使用javascript中的新行创建html

时间:2019-01-26 18:14:17

标签: javascript jquery

php-可行:

$html = "
    <div class='part partb4'>
    <img class='imgb4' src='imgdef/01.jpg' alt='img'>
    </div>";
echo $html;

javascript-不起作用:

let html = "    
    <div class='part partb4'>
    <img class='imgb4' src='imgdef/01.jpg' alt='img'>
    </div>";
    $(html).insertBefore($('.part').eq(0));

javascript-可行:

let html = "<div class='part partb4'><img class='imgb4' src='imgdef/01.jpg' alt='img'></div>";

$(html).insertBefore($('.part').eq(0));

如何使第二个示例有效?我在Windows上,是记事本++。

谢谢。

5 个答案:

答案 0 :(得分:1)

对于多行,您应该使用单个反引号`(在1之前按Shift +按钮)

let html = `
  <div class='part partb4'>
<img class='imgb4' src='imgdef/01.jpg' alt='img'>
</div>
`;

答案 1 :(得分:1)

通过添加反斜杠(\)作为行中的最后一个字符,您甚至都不能在其后插入空格键,因为这样一来,它就不会取消换行符。

let html = "    
<div class='part partb4'>\
<img class='imgb4' src='imgdef/01.jpg' alt='img'>\
</div>";
$(html).insertBefore($('.part').eq(0));

答案 2 :(得分:0)

ECMAScript 6(ES6)引入了一种新型的文字,即模板文字。它们具有许多功能,其中包括变量插值,但最重要的是,对于这个问题,它们可以是多行的。

模板文字由反引号分隔:

var html = `
  <div class='part partb4'>
<img class='imgb4' src='imgdef/01.jpg' alt='img'>
</div>
`;

答案 3 :(得分:0)

Javascript允许使用反引号在ES6中拆分字符串:

let html = `    
<div class='part partb4'>
<img class='imgb4' src='imgdef/01.jpg' alt='img'>
</div>`;
$(html).insertBefore($('.part').eq(0));

答案 4 :(得分:0)

您正在使用多行字符串,这就是为什么它不能正常工作的原因 使用模板文字

let html = `    
    <div class='part partb4'>
    <img class='imgb4' src='imgdef/01.jpg' alt='img'>
    </div>`;
    $(html).insertBefore($('.part').eq(0));