包含html标签的javascript子字符串文本

Substring text with javascript including html tags

本文关键字:字符串 文本 javascript html 标签 包含      更新时间:2023-09-26

我想要一个类似于follow的字符串的子字符串。我有起始位置和字符串的长度。我已经检查了这个问题子字符串文本在Javascript中的HTML标签。但在这个子字符串是从0执行,但我有一个随机的开始位置。知道怎么做吗?

var str = 'Lorem ipsum <p>dolor <strong>sit</strong> amet</p>, consectetur adipiscing elit.'

演示

function html_substr( str, start ,count ) {
    var div = document.createElement('div');
    div.innerHTML = str;
    walk( div, track );
    function track( el ) {
        if( count > 0 ) {
            var len = el.data.length;
            if(start<=len){
                el.data = el.substringData(start,len);
                start=0;
            } else{
                start-=len;
                el.data = '';
            }
            len = el.data.length;
            count -= len;
            if( count <= 0 ) {
                el.data = el.substringData( 0, el.data.length + count );
            }
        } else {
            el.data = '';
        }
    }
    function walk( el, fn ) {
        var node = el.firstChild;
        do {
            if( node.nodeType === 3 ) {
                fn(node);
            } else if( node.nodeType === 1 && node.childNodes && node.childNodes[0] ) {
                walk( node, fn );
            }
        } while( node = node.nextSibling );
    }
    return div.innerHTML;
}

称其为

html_substr( str,13, 2 );

这里有一个本地DOM API方法来做这类事情。浏览器已经具有强大的内置HTML解析能力。不需要重新发明轮子

var el = document.createElement("div");
el.innerHTML = 'Lorem ipsum <p>dolor <strong>sit</strong> amet</p>, consectetur adipiscing elit.';
el.getElementsByTagName("p").textContent;

工作演示

结果是一个非html字符串,你可以很容易地操作.substring

那么,这是如何工作的呢?

我们将HTML转储到一个HTML元素中。

然后我们使用DOM API说:

在我们刚刚给你的HTML中,找到所有的p标签,取第一个(那是[0]),并给我们它的textContent"。