Home > Article > Web Front-end > Summary of ways to wrap labels in innerHTML_javascript tips

Summary of ways to wrap labels in innerHTML_javascript tips

WBOYOriginal: 2016-05-16 15:45:051747browse

When using innerHTML to generate a structure, in order to make the structure look clear, you can add a backslash at the end of each line to maintain the original html structure without squeezing the tags together

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>innerHTML中标签可以换行的方法</title>
</head>
<body>
<script>
//function fnNew(){
  var sHtml = '';
  for(var i = 0; i < 2; i++){
    sHtml += '<li class="in">\
          <div class="in-con">\
            <button class="in-btn_s">显示</button>\
            <button class="in-btn_h">隐藏</button>\
          </div>\
          <div class="in-show">第'+ i +'种方法:'+ data[i]+'</div>\
        </li>';   
  }
  oList.innerHTML = sHtml;
}
</script>
</body>
</html>

I just learned Brother Shiba’s Javascript today. Speaking of the use of innerHMTL, the teacher said that the tags inside did not wrap. I felt that it would be inconvenient for me to operate it in the future, so I copied this code and asked how to do it. Friends who have programmed

function t2(){
    var cont = document.getElementById('container');

    var htmlcode =  "<p><ul><li><span>东</span></li><li>南</li><li>西</li><li>北</li></ul></p>";

    cont.innerHTML = htmlcode;

Can the code below

be written so that it can be line-wrapped?

<p><ul><li><span>东</span></li><li>南</li><li>西</li><li>北</li></ul></p>

But hard work pays off, someone finally told me the method See the code below

var htmlcode = "<p> \
                                   <ul> \
                                         <li><span>东</span></li> \
                                         <li>南</li> \
                                         <li>西</li> \
                                         <li>北</li> \
                                   </ul> \
                             </p>";

That is, each time the code needs to be wrapped, there is one more line break. (No special tricks, I just feel more comfortable writing code this way)

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Detailed explanation of the use of this keyword in JavaScriptNext article：Detailed explanation of the use of this keyword in JavaScript

See more

Summary of ways to wrap labels in innerHTML_javascript tips

Related articles