> 웹 프론트엔드 > JS 튜토리얼 > innerHTML_javascript 팁에서 라벨을 래핑하는 방법 요약

innerHTML_javascript 팁에서 라벨을 래핑하는 방법 요약

WBOY
풀어 주다: 2016-05-16 15:45:05
원래의
1765명이 탐색했습니다.

innerHTML을 사용하여 구조를 생성할 때 구조가 명확하게 보이도록 각 줄 끝에 백슬래시를 추가하여 태그를 함께 누르지 않고도 원래 HTML 구조를 유지할 수 있습니다

<!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>

로그인 후 복사

오늘 방금 시바 형제님의 자바스크립트를 배웠습니다. innerHMTL 사용에 대해 선생님께서 안에 있는 태그가 감싸져 있지 않다고 하셔서 나중에 조작하기 불편할 것 같아 이 코드를 복사했습니다. 프로그래밍을 해 본 친구들에게
방법을 물었습니다.

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;

로그인 후 복사

아래 코드를 줄 바꿈이 가능하도록 작성할 수 있나요?

<p><ul><li><span>东</span></li><li>南</li><li>西</li><li>北</li></ul></p>
로그인 후 복사
근심한 노력이 결실을 맺었고 마침내 누군가 나에게 방법을 알려주었습니다. 아래 코드를 참조하세요

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

로그인 후 복사
즉, 코드를 래핑해야 할 때마다 줄 바꿈이 한 번 더 발생합니다. (특별한 요령은 없습니다. 이렇게 하면 코드 작성이 더 편해집니다.)

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿