javascript：按类拆分 html

发布于 2024-12-10 20:38:07 字数 453 浏览 0 评论 0原文

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

假设我有这个 html：

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

我想按分页符分割我的内容以获得以下输出：

page1 buffer: page 1

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

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

想法？

原文

i'm creating a simple html editor with jquery.

say i have this html:

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

i want to split my content by pageBreaks to have this output:

page1 buffer: page 1

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

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

ideas?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

不一样的天空 2024-12-17 20:38:07

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

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

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

并且，一个工作示例： http://jsfiddle.net/jfriend00/wpyH2/

PS 请注意正则表达式在这里尝试非常通用，因为浏览器并不总是返回您在页面中放入的相同的innerHTML。

Since your pages are not enclosed by HTML tags (which would be the DOM-friendly way of solving this problem), you will have to do your own processing of the HTML in the content div to break apart the content into your pages. Here's one way to do that using a regular expression to split that content at each of your pagebreaks.

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

At this point, the pages array would have the content between each page break.

And, a working example: http://jsfiddle.net/jfriend00/wpyH2/

P.S. Note that the regular expression tries to be very general here because browsers do not always give you back the same innerHTML that you put in the page.

回复收藏 0 原文

~没有更多了~