如何在iframe的head标签中追加元素？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何在iframe的head标签中追加元素？相关的知识，希望对你有一定的参考价值。
1）我想动态创建一个iframe。
2）我已经模拟了head和body标签的数据（字符串模板）。
3）我想用2）中的给定数据创建iframe
码
var bodyhtml = '<p>Content</p>';
var headHtml = '<title>Title</title>';
var iframe = document.createElement('iframe');
// inject the bodyHTML to locally iframe
iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(bodyHtml );
// headHtml how ?
// inject my iframe in the DOM
$('mySelector').append(iframe);
如何在iframe头标记中注入headHtml？
答案
你已经完成了大部分工作。文档的内容不仅仅是正文，而是整个内容，所以你构建整个东西，然后将其传递给encodeURIComponent（而不是encodeURI）：
var bodyHtml = '<p>Content</p>';
var headHtml = '<title>Title</title>';
var iframe = document.createElement('iframe');
// inject the bodyHTML to locally iframe
iframe.src = 'data:text/html;charset=utf-8,' + encodeURIComponent(
"<!doctype html>" +
"<html>" +
"<head>" + headHtml + "</head>" +
"<body>" + bodyHtml + "</body>" +
"</html>"
);
// inject my iframe in the DOM
$('body').append(iframe);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>以上是关于如何在iframe的head标签中追加元素？的主要内容，如果未能解决你的问题，请参考以下文章
ie 下面 js动态设置 iframe src 不显示，一片空白
javascript 控制 iframe 里面的 a 元素让它不跳出iframe