<내장> 대 <개체>

Adobe PDF 뷰어를 표시 할 때 HTML 파일에 사용할 올바른 / 최고의 태그는 무엇입니까?

지금은 아래 코드를 사용하고 있지만 이상한 부작용이 있습니다 (예 : 다른 <input>텍스트 상자로 설정 한 시작 포커스를 훔치는 것 같습니다 . jQueryUI Resizeable 클래스에서는 실제로 재생되지 않는 것 같습니다. 기타.)

<embed src="abc.pdf" type="application/pdf" />

<object>태그로도 같은 작업을 수행 할 수 있습니까? 한 태그를 사용하는 것보다 다른 태그를 사용하는 것의 장단점이 있습니까?

객체 대 EMBED-왜 항상 embed를 사용하지 않습니까?

결론 : OBJECT는 양호하고 EMBED는 낡았습니다. IE의 PARAM 태그 외에도 브라우저가 OBJECT의 참조 된 플러그인을 지원하지 않으면 OBJECT 태그 사이의 모든 컨텐츠가 렌더링되며, 컨텐츠의 렌더링 여부에 관계없이 http가 요청됩니다.

object페이지에 무언가를 포함시키는 현재 표준 태그입니다. embed넷스케이프 (함께가 포함 된 img) 처럼 아무것도 전에 object온 있었다 W3C의 마음.

다음 과 같이 PDFobject 를 포함시키는 방법 입니다 .

<object data="data/test.pdf" type="application/pdf" width="300" height="200">
  alt : <a href="data/test.pdf">test.pdf</a>
</object>

거의 모든 브라우저에 표시 할 인라인 PDF가 실제로 필요한 경우 이전 브라우저는 이해 embed하지만 그렇지 않은 object경우 다음을 수행해야합니다.

<object data="abc.pdf" type="application/pdf">
    <embed src="abc.pdf" type="application/pdf" />
</object>

이 버전 은 유효하지 않습니다 .

다른 옵션들 :

<object type="application/pdf" data="filename.pdf" width="100%" height="100%">
</object>

<object type="application/pdf" data="#request.localhost#_includes/filename.pdf" 
        width="100%" height="100%">
  <param name="src" value="#request.localhost#_includes/filename.pdf">
</object>

크로스 브라우저와 호환되지 않지만 (예 : 크롬 또는 안드로이드에서 작동하지 않을 수도 있고 아마도 다른 것-> 대신 다운로드하라는 메시지 표시) iframe 방법을 사용할 수도 있습니다. dataURL 및 일반 URL에서 작동하지만 다른 예제가 dataURLS와 작동하는지 확실하지 않습니다 (다른 예제가 dataURLS와 작동하는지 알려주세요).

 <iframe class="page-icon preview-pane" frameborder="0" height="352" width="396" src="data:application/pdf;base64, ..DATAURLHERE!... "></iframe>

웹 페이지에서 pdf를 표시하는 가장 좋은 크로스 브라우저 솔루션은 Mozilla PDF.js 프로젝트 코드를 사용하는 것입니다. node.js 서비스로 실행하여 다음과 같이 사용할 수 있습니다.

<iframe style="width:100%;height:500px" src="http://www.mysite.co.uk/libs/pdfjs/web/viewer.html?file="http://www.mysite.co.uk/mypdf.pdf"></iframe>

pdf.js 사용 방법에 대한 튜토리얼은이 ejectamenta 블로그 기사 에서 찾을 수 있습니다.

Embed는 표준 태그가 아니지만 객체입니다. 여기 기사 는 상황이 그렇게 간단하지 않다 보이기 때문에 좋아 보이는 당신을 도울 것이라는 점은. PDF 예제가 포함되어 있습니다.