在Javascript / Node.js中recursion获取两个元素之间的所有HTML（不包括结束标记）

我需要能够将某些元素分别存储在数据库中，但在检索时重新生成HTML以供显示。 我们的解决scheme（开放build议）是存储条目的leadingHTML和trailngHTML属性。

这应该使我们能够像我们想要的那样灵活 – 但只有一个问题。 我正在试图写代码来parsingHTML。 以下面的HTML为例：

<h1>this is leadingHTML</h1> <h2>this is leadingHTML2</h2> <p class='select' id='1'>A1</p> <h1 >this is trailngHTML</h1> <h2>this is trailngHTML2</h2> <p class='select' id='2'>A2</p> <h1>this is trailngHTML3</h1> <h2>this is trailngHTML4</h2> <p class='select' id='3'>A3</p> <figure id='fig'> <figCaption> this is some text <span class='select'>B1</span> <div>some text <span class='select'>B2</span></div> </figCaption> <img class='select' alt='test' src='test.jpg'/> <img class='select' alt='test' src='test.jpg'/> <img class='select' alt='test' src='test.jpg'/> </figure> <p class="select">A4</p> 

通过“select”类来获得所有元素是很容易的。 但是我真的可以使用帮助获取这些元素之间的HTMLstring。 对于元素<p class='select' id='3'>A3</p> ，我需要一个可以返回给我下面的string的函数：values：

元件

<p class='select' id='3'>A3</p>

leadingHTML

 leadingHTML= '<h1>this is trailngHTML3</h1><h2>this is trailngHTML4</h2>' 

trailingHTML

 trailingHTML= '<figure id='fig><figCaption>this is some text' 

这样，我可以按照项目所需的方式来存储元素，但仍然可以重新构buildHTML来显示。

我们使用Node.js作为后端，所以这将需要用Javascript编写。 经过很多的挫折，我非常相信没有办法做到这一点，没有一些丑陋的代码？ 任何帮助深表感谢。

到目前为止，这就是我所拥有的（不能说我很自豪）：

 var checkChildren = function walk(node,state,func){ if (state.isPt===false){ var state=func(node,state); } else if(state.isPt===true){ return state; } node=$(node).children().first(); while (node.length>0 && state.isPt!==true){ state=walk(node,state,func); node=$(node).next(); } return state; }; function getTrailing(start,html){ var checkFind = $(start).find('.pt'); if (checkFind.length>0){ //selector is in the child somewhere state= { html: html, isPt: false}; var getChildHTML = checkChildren(start,state,function(node,state){ if ($(node).is($(checkFind).first())){ return { html: html, isPt: true,}; } else{ html=html+'<'+$(node)[0].name; for (var key in $(node)[0].attribs){ html=html+" "+key+"='"+$(node)[0].attribs[key]+"'"; }; html=html+'>'; return { html: html, isPt: false,}; } }); return getChildHTML; } else{ return html; } } var start1 = $("#fig"); var html = ''; test=getTrailing(start1,html); 

它返回这个：

 { html: '<figure id=\'fig\' class=\'test\' style=\'color:red;\'><figcaption class=\'test\' style=\'color:red;\'><span><div>', isPt: true } 

更新澄清 – 输出可能是无效的HTML。 我只需要两个感兴趣的元素之间的所有HTML的string。 如果感兴趣的第二个元素是后代，那么结果将是无效的HTML（因为string一find下一个元素就应该停止）。