다음과 같은 내용을 편집 할 수 있다고 가정 해 보겠습니다.
<div class="example" contenteditable="true" id="test">
<div><span class="inside" >Type here</span>" "</div>
</div>
div 내부에 span 요소가 있습니다. 또한 공백이 있음을 알 수 사이 </span>와</div>
이 공간에는 단순한 공백이나 단어 만있을 수 있습니다. 여기에서 문자열 또는 문자의 길이를 어떻게 확인합니까?
예를 들어, </span>please</div>길이는 6이어야합니다 ( "please"라는 단어에서).
즉, 나는 엄격 사이의 길이를 찾고 있어요 </span>및</div>
접근 방법이 있습니까?
당신은 얻을 수 nextSibling의 span다음의 사용, 노드 nodeValue텍스트를 얻을 속성을.
var node = document.querySelector('.inside').nextSibling;
console.log(node.nodeValue.length)<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="example" contenteditable="true" id="test">
<div><span class="inside">Type here</span>please</div>
</div>부분 jQuery를 get(index)사용하여 기본 DOM 요소를 가져 오는 데 사용됩니다.
var contenteditable = $('[contenteditable] div span').get(0).nextSibling;
console.log(contenteditable.nodeValue.length)<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="example" contenteditable="true" id="test">
<div><span class="inside">Type here</span>please</div>
</div>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다