如何以纯HTML5 / CSS / Jquery显示epub格式的书

Question

是否可以使用纯HTML5，CSS和Jquery在网络浏览器中显示epub格式的图书？ 有人可以建议我该怎么做吗？ 我还必须对此做出响应，以使其能够在iPad上运行。 我知道，但不知道如何使用HTML和Javascript阅读epub。

epub可能包含一些数学函数，我也需要正确显示它们。

Answer 1

是否可以使用纯HTML5，CSS和jQuery在网络浏览器中显示epub格式的图书？

对的，这是可能的。

为什么要编写epub阅读器？ 已经有很多了。

无论如何，您的问题是通用问题的特定形式，是否可以为epub编写电子书阅读器？ 显然，是的，可能已经写好了。 如果可以用一种语言或一种平台编写它，则可以用另一种语言或另一种平台编写。

但是实际上，您甚至不需要编写阅读器，因为epub只是罐中的小网站。 将epub文件解压缩到服务器上的某个位置，然后将浏览器导航到页面之一。 瞧，您正在阅读。 您要目录吗？ 导航到toc.xhtml或等效文件，然后转到。

从一页移到下一页怎么办？ 您需要知道页面的显示顺序。编写一个小型服务器组件，该组件通常解析名为content.opf的文件，并根据manifest元素中文件的顺序发出一些HTML文件，其中一个前进和后退按钮以及一个iframe以显示内容。 在查看时，解析标题和其他有趣的元数据。 所有这些实质上就是epubjs所做的。

但是我从您的问题中得知您想完全在客户端/浏览器端执行此操作。 好吧，您也应该以Readium的形式完成该工作。 使用您最喜欢的JS解压缩库（警告，可能会很慢）解压缩epub文件，并编写一些JS来解析元数据并抛出页面，同样很可能是在iframe中带有一些镶边。

但是，如果您希望得到分页输出，人们会期望电子书阅读器怎么办？ 这是事情开始变得繁琐的地方，可能是退后一步并再次问自己为什么这样做的好地方。 无论如何，如果您确定您确实想要分页显示，那么您将需要弄清楚一些逻辑组合，包括窗口化，框架化，剪切，偏移和/或使用“区域”来帮助您。 一些电子书阅读器只是在这里闲逛，然后说，滚动/未分页输出到底有什么问题？

但是电子书阅读器还会做很多其他事情。 例如，大多数将允许您更改行距，边距或字体大小。 这些用户设置如何与本书CSS文件中的样式进行交互？ 一些读者采用解析CSS的方法（也有相应的库）并重写它以获得您或您的用户想要的结果。

更喜欢应用而不是浏览器应用？ 将整个shebang包裹在PhoneGap中。

要想成为一名能干的读者，您将不得不担心许多其他事情。 就在我脑海中，这包括显示某些书所指定的“指南”或“地标”，记住会话之间的阅读位置和用户选项，并可能提供某种书架功能。

尽管某些客户端电子书阅读器确实使用jQuery，但请记住，由于epub是HTML5 / CSS2.5 / JS，因此内容本身只能由现代浏览器可靠地显示。 但是，如果您使用的是现代浏览器，则不需要jQuery中90％的头发即可实现跨浏览器兼容性。 使用更轻巧的组件（例如Backbone和/或Underscore）会更好。 您可能甚至不需要选择器库，因为您将拥有querySelector。

祝好运！

Answer 2

对于科学论文（期刊论文），有一个“最佳解决方案”，可以在浏览器上模拟EPUB阅读器 。 它可以使用XML（ JATS ）或XHTML（来自EPUB）内容。 PubReader使用HTML5和CSS3中提供的功能。

使用CSS和Javascript，它可以实现格式，分页，导航和文本重排。 整篇文章都作为单个HTML页面加载到浏览器中，并在本地处理分页等。 看到：

• PubMed Central的PubReader正在运行！

• PubReader说明

• PubReader源代码

PS：PubReader与@torazaburo建议类似，即EPUB-Readium浏览器界面 。

Answer 3

在GitHub上检查此项目 。 这是一个javascript epub阅读器。 它有点旧，但是可以满足您的要求。