공백 안에 있는 문자들을 span으로 감싸는 방법?
조회수 906회
<div>
<span> ABC BCD</span>
</div>
다음과 같이 로 둘러쌓인 문자가 있을때
<div>
<span>ABC</span>
<span>BCD</span>
</div>
이것 처럼 변환하고 싶은데
어떤 방식으로 접근하면 될까요?
2 답변
-
자답합니다.
작성한 코드 공유합니다.
var result = ''; var div = document.querySelector('div'); // get the div wrapper div.childNodes.forEach(function(node) { // loop over the nodes if (node.nodeName == '#text') { // if text var span = document.createElement('span'); span.textContent = node.textContent; var text_list = span.innerHTML.split(' '); var text_elements = text_list.map(function(text) { if (text) { return '<span>' + text + '</span>'; } return ''; }); result += text_elements.join(' '); } else { result += node.outerHTML; } }); div.innerHTML = result; -
아래와 같이 해볼 수 있겠네요
var s = " ABC BCD" s.split(' ').filter(item => item).forEach(function (v, i){console.log(' <div>' + v + '</div>');}) <div>ABC</div> <div>BCD</div>
댓글 입력