javascript：按类拆分html

Question

我正在用 jquery 创建一个简单的 html 编辑器。

说我有这个 html:

<div id="content">
    page 1
<div class="pageBreak"></div>
    page 2
<div class="pageBreak"></div>
    page 3
</div>

我想按 pageBreaks 拆分我的内容以获得此输出：

page1 buffer: page 1

page2 buffer: <div class="pageBreak"></div>page 2

page3 buffer: <div class="pageBreak"></div>page 3

想法？

Answer 1

由于您的页面没有包含在 HTML 标记中（这将是解决此问题的 DOM 友好方式），您必须自己处理内容 div 中的 HTML 以将内容分解为您的页面.这是使用正则表达式在每个分页符处拆分内容的一种方法。

var t = $("#content").html();
var pages = t.split(/<div\s+class\s*=\s*['"]?pageBreak["']?\s*>\s*<\/div>/i);

此时，pages 数组将包含每个分页符之间的内容。

还有一个工作示例：http://jsfiddle.net/jfriend00/wpyH2/

附：请注意，正则表达式在这里尽量通用，因为浏览器并不总是返回您在页面中放置的相同的 innerHTML。