0
182
ViewsHow to load element into a certain tag
How do I append the pdfObject to the div inside my HTML?
I want to use the document.querySelector to get the id of the div and then load my PDF into there
here is my javascript function:
showPDF: function (button) {
let url = document.getElementById("URLinput").value;
button.style.display = "none";
let pdfObject = document.createElement("OBJECT");
pdfObject.setAttribute("data", url);
pdfObject.setAttribute("id", "pdf");
let a = document.querySelector(selector)!= null;
document.a.appendChild(pdfObject);
},
and here is my HTML:
<head>
<link rel="stylesheet" href="../css/pdfviewer.css">
</head>
<body>
<h1>PDF Viewer</h1>
<input id="show" type="button" value="PDF anzeigen" onclick="HM.PDFViewer.showPDF(this)"/>
<input id="URLinput" type="text" value="/pdf/Doku.pdf"/>
<script type="text/javascript" src="/js/pdfviewer.js"></script>
<div id="selector"></div>
<p> test </p>
</body>
2 answers
Answer question0
EMBED's functionality has been standardized in HTML5 and is used to provide containers for plugins. The main problem with EMBED is its dependency on plugins to be loaded, which has become less common nowadays.
Instead, you could either use IFRAME (which can include HTML pages and possibly other media) or OBJECT.
Modified version of your code:
showPDF: function (button) {
let url = document.getElementById("URLinput").value;
button.style.display = "none";
let pdfObject = document.createElement("OBJECT");
pdfObject.setAttribute("data", url);
pdfObject.setAttribute("id", "pdf");
document.body.appendChild(pdfObject);
}
This removes the dependency of having to use browser plugins or external JS libraries while also being widely supported.
0
The modern browser is a text processor (rather than word processor) which is not a What You Serve Is What You Get (WHSIWYG) editor since the configuration is set by the 7 billion potential users. so here by comparison are Edge on the left and Firefox on the right with my base settings (no extra blockers are used).
Where from < Embed> < iFrame > and < Object > at least < iFrame> (W3 Recommended) is most consistent giving a download in both Edge and in FireFox, just the same as a traditional A Href=download would do.
As said each browser can block different aspects so in this one all 3 are blocked evenly so I can download whichever one I wish
Just to confirm why you cannot enforce a users view of a PDF in their editor here is yet another pdf browser view:-
