jQuery를 사용하여 요소 내의 모든 텍스트 노드를 효율적으로 선택하려면 어떻게 해야 합니까?

jQuery로 텍스트 노드 선택

jQuery 컬렉션으로 요소의 모든 하위 텍스트 노드를 검색하는 것은 복잡한 작업이 될 수 있습니다. jQuery에는 이를 위한 전용 기능이 없기 때문에 방법의 조합이 필요합니다.

해결책에는 하위 노드(텍스트 노드 포함)를 검색하는 content() 함수와 find() 함수를 사용하는 것이 포함됩니다. 모든 하위 요소를 선택합니다(텍스트 노드 제외). 이러한 결과를 병합하면 지정된 요소 내의 모든 텍스트 노드를 얻을 수 있습니다.

var getTextNodesIn = function(el) {
    return $(el).find(":not(iframe)").addBack().contents().filter(function() {
        return this.nodeType == 3;
    });
};

getTextNodesIn(el);

고려 사항:

• 이 접근 방식은 순수 노드에 비해 비효율적일 수 있습니다. DOM 메서드.
• jQuery의 내용() 오버로드로 인해 해결 방법이 필요합니다. function.
• 다음과 같은 jQuery가 아닌 솔루션은 보다 효율적인 대안을 제공합니다.

function getTextNodesIn(node, includeWhitespaceNodes) {
    var textNodes = [], nonWhitespaceMatcher = /\S/;

    function getTextNodes(node) {
        if (node.nodeType == 3) {
            if (includeWhitespaceNodes || nonWhitespaceMatcher.test(node.nodeValue)) {
                textNodes.push(node);
            }
        } else {
            for (var i = 0, len = node.childNodes.length; i < len; ++i) {
                getTextNodes(node.childNodes[i]);
            }
        }
    }

    getTextNodes(node);
    return textNodes;
}
getTextNodesIn(el);

위 내용은 jQuery를 사용하여 요소 내의 모든 텍스트 노드를 효율적으로 선택하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!