반응형
자바스크립트에서 HTML 문장 처리
개발에서 HTML 입힐때나 HTML 코드에 개발코드 넣을때
버거로운 """ 처리같이 열고 닫기를 줄일 수 있는 방법 입니다.
HTML = <<"HERE"
This Is
A Multiline
String
HERE
var html = `
<div>
<span>Some HTML here</span>
</div>
`;
multiline strings
개발이나 스크립트 코드 중 multiline strings 처리로 열고 닫기를 최소로 하여 코드 가독성도 높아 집니다.
사용예시
$.each(result, function(i){
strHTML += `
<div class="comment clearfix">
<div class="comment-avatar">
<img src="/dist/idea/images/avatar.jpg" alt="avatar">
</div>
<div class="comment-content">
<div class="comment-meta"> `+ result[i].writer +` | `+ result[i].crdt +` </div>
<div class="comment-body clearfix">
<p> `+ result[i].comment +` </p>
<!-- <a href="blog-post.html" class="btn btn-gray more pull-right"><i class="fa fa-reply"></i> Reply</a> -->
</div>
</div>
</div>
`;
})
$('#commList').append(strHTML);
ES5
"foo \
bar"ES6
const htmlString = `Say hello to
multi-line
strings!`;Interpolating variables is a popular new feature that comes with back-tick delimited strings:
const htmlString = `${user.name} liked your post about strings`;
This just transpiles down to concatenation:
user.name + ' liked your post about strings'
PHP 사용 예시
multiline strings 사용부분 앞/뒤에는 공백(스페이스값)이 있으면 안되요~
$heredoc = <<<HTML
<!-- item -->
<div class="timeline clearfix">{$use}</div>
<div class="timeline-item object-non" data-animation-effect="fadeInUp" data-effect-delay="200">
<article class="clearfix">
<div class="body">
<div class="content">
HTML;
echo $heredoc;
코드 정리 하다가 기록용으로 ...
반응형
'IT' 카테고리의 다른 글
| 무료 이미지 사이트 추천 - 픽사베이 (0) | 2022.12.03 |
|---|---|
| ASUS - 아수스 젠북 듀오 C타입 USB 허브 문제 - Baseus(베이스어스) (13) | 2022.11.30 |
| [.6] 플러터-Flutter WebView 웹페이지에 자바스크립트 사용설정 추가 (0) | 2022.11.07 |
| [.5] 플러터-Flutter WebView 안드로이드 apk 파일 생성 (net::ERR_CACHE_MISS / Physical Device) (1) | 2022.11.07 |
| [.4] 플러터-Flutter WebView - Progress Indicator 위젯이용 로딩 화면 구현 (0) | 2022.11.06 |
