0

我正在构建一个javascript应用程序,我需要知道属于用户选择的html标签,然后为了方便使用将它们放在一个数组中。

我用htmlText它给了我一个看起来像这样的字符串:

<h1><span style="color: rgb(102, 51, 153); font-weight: bold; text-decoration: underline;"><sub>test</sub></span></h1>

由于我对正则表达式几乎一无所知,而且我所知道的似乎并没有做我想做的事,所以我希望你们中的一个人能在这方面帮助我。

那么让上面的字符串看起来像下面的数组的最好方法是什么?

<h1>,
<span style="color: rgb(102, 51, 153); font-weight: bold; text-decoration: underline;">,
<sub>

到目前为止我的代码(不知道我是否在正确的轨道上):

var fullhtml = SEOM_common.range.htmlText;//Get user selection + Surrounding html tags
var tags = fullhtml.split(SEOM_common.selected_value);//Split by user selection
var tags_arr = tags[0].match(/<(.+)>/);//Create array of tags

谢谢大家的回答和评论。我设法构建了以下方法,这正是我想要的。

find_all_parents : function(selectRange,endNode){
   var nodes = [];
    var nodes_to_go = [];
    if(selectRange.commonAncestorContainer) nodes_to_go.push(selectRange.commonAncestorContainer.parentNode);//all browsers
        else nodes_to_go.push(selectRange.parentElement());//IE<9 browsers

        var node;

        while( (node=nodes_to_go.pop()) && node.tagName.toLowerCase() != endNode){
            if(node.nodeType === 1){ //only element nodes (tags)
                nodes.push(node);
            }

            nodes_to_go.push(node.parentNode);          
        }
        return nodes;
    }
4

2 回答 2

1

不要为此使用正则表达式。改用文档操作方法并获取标签本身(而不是标签的文本表示)。

例如:

var find_all_nodes = function(rootNode){
    var nodes = [];
    var nodes_to_go = [rootNode];
    var node;
    while( (node=nodes_to_go.pop()) ){
        if(node.nodeType === 1){ //only element nodes (tags)
            nodes.push(nodes_to_go);
        }
        var cs = node.childNodes;
        for(var i=0; i<cs.length; i++){
            nodes_to_go.push(cs[i]);
        }
    }
    return nodes;
}

一旦有了标签,您就可以从中获取各种信息。我建议查看MDN的 DOM 文档和Quirksmode的兼容性说明

于 2012-06-27T21:06:10.183 回答
0

您不应该使用 Regex 进行 HTML/XML 解析。

...除非您有充分的理由这样做!

如果是,则替换(<h1>)(<span[^>]*>)(<sub>)[^<]*</sub></span></h1>$1,\n$2\n$3.

于 2012-06-27T18:03:01.887 回答