是否可以在浏览器中动态添加元素pdf viewer

时间:2016-10-14 13:04:20

标签: javascript angular javascript-events javascript-objects

在浏览器中打开pdf时,必须添加字体图标并设置一些操作。

我在浏览器的iframe中打开了pdf,纸质工具栏的顶部有3个图标。

1)旋转2)打印3)下载。

需要再添加一个元素。是否可以在javascript中完成。

<html>
<head>
 <link href=" https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet"/>
    <script src="http://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<iframe id="myFrame" style="display:none" width="600" height="300">
 <i class="fa fa-bell" >Hello</i>
<button type="button" >Hellos</button>

    </iframe>
<input type="button" value="Open PDF" onclick = "openPdf()"/>
<input type="button" value="Open PDF1" onclick = "openPdf1()"/>
<script type="text/javascript">
function openPdf()
{
var omyFrame = document.getElementById("myFrame");
omyFrame.style.display="block";
omyFrame.src = "AngularJS-Brad-Green-Shyam-Seshadri(www.ebook-dl.com).pdf";
document.getElementById("myFrame").className = "fa fa-bell";

   var btn = document.createElement("button");  
    var t = document.createTextNode("CLICK ME");
    btn.appendChild(t);
    document.body.appendChild(btn);



}

function openPdf1()
{
var omyFrame = document.getElementById("myFrame");
omyFrame.style.display="block";
omyFrame.src = "dummy_pdf.pdf";
}

</script>
</body>

没有任何作用。 enter image description here enter image description here

0 个答案:

没有答案