1. Online preview of PDF files
1. Definition and usage of HTML5 new tag <embed>
The <embed> tag defines embedded content. This tag is self-closing, which means that if the browser does not support PDF embedding, then the content of this tag will not be visible.
Examples
<embed src="/file/操作手册.pdf" type="application/pdf" width="100%" height="100%" />
2.<iframe>
The <iframe> method is one of the easiest ways to embed PDF. However, if the <iframe> browser does not support PDF rendering, it may not provide enough fallback content.
Examples
< Iframes. Src = "your PDF address" width = "100%" height = "100%" > The browser can not support PDF, please click to view: < A href = "PDF address" > Download PDF </ A >
< / iframe >
3.<object>
Unlike <embed>, <object> if the browser does not support PDF embedding, this element can prompt the content. All browsers support the <object> element, but the implementation in each browser is usually different. If you use this <object> element, be sure to thoroughly test your page in the browser and operating system.
Examples
< object data = "/ file / operation manual.pdf" type = "application / pdf" width = "100%" height = "100%" > This browser does not support PDF. Please click to view: < a href = "/ file / operation manual.pdf " > Download PDF </ a > . </ p > </ object >
2. Online preview of word, xls, ppt
The online preview of word, ppt, and xls files is relatively simple and can be achieved directly by calling Microsoft's online preview function (preview premise: resources must be publicly accessible)
<iframe src='https://view.officeapps.live.com/op/view.aspx?src=http://storage.xuetangx.com/public_assets/xuetangx/PDF/1.xls' width='100%' height='100%' frameborder='1'> </iframe>
src is the file address to be previewed
Supplement: Google ’s online preview of documents is the same as that of Microsoft (resources must be publicly accessible)
<iframe src="https://docs.google.com/viewer?url=fileurl"></iframe>
3. XDOC online preview
XDOC can preview the DOC document expressed by DataURI. In addition, XDOC can also realize online preview of text, parameter text, html text, json text, official document, etc. For the specific implementation method, please refer to the official document
The following way can achieve a quick preview of the word, but the editor used for the file may have some restrictions
<a href="http://www.xdocin.com/xdoc?_func=to&_format=html&_cache=1&_xdoc=http://www.xdocin.com/demo/demo.docx" target="_blank" rel="nofollow">XDOC</a>