iframe不显示滚动条并且设置动态高度、添加内部样式和脚本

html 复制代码
<iframe id="myIframe" frameborder="0" width="100%" scrolling="no" onload="this.height = this.contentWindow.document.body.scrollHeight+300">
</iframe>
javascript 复制代码
$('#myIframe').load(function () {
				//body{text-align:center;}
				// table{margin:0px auto;}
				$('#myIframe').contents().find("head").append($(`<style>
				ol{
					list-style:none !important;
					list-style-type:none !important;
				}
				ul{
					list-style:none !important;
					list-style-type:none !important;
				}
				table{border-top:1px solid #7F7F7F!important;border-left:1px solid #7F7F7F!important;border-collapse:collapse;}
				table td{
					border-bottom:1px solid #7F7F7F!important;border-right:1px solid #7F7F7F!important;padding:5px 12px;
					word-break:break-all !important;word-wrap:break-word !important;
					vertical-align:middle !important;text-align:center !important;
				}
				</style>`));
				$('#myIframe').contents().find("head").append($(`<link rel="stylesheet" type="text/css" href="static/Ueditor/third-party/SyntaxHighlighter/shCoreDefault.css"/>`));

				var script   = document.createElement("script");
				script.type  = "text/javascript";
				script.charset  = "utf-8";
				script.text   = `
					const pre = document.getElementsByTagName('pre');
					for(let me of pre){
						me.setAttribute("class","syntaxhighlighter");
					}
					`;
				$('#myIframe').contents().find("head").get(0).appendChild(script);

				setTimeout(function(){//一定要加延时,不然有问题
					$('#myIframe').get(0).height = $('#myIframe').get(0).contentWindow.document.body.scrollHeight+300;//多加点
				}, 100);
			});
相关推荐
jllllyuz18 分钟前
matlab实现蚁群算法解决公交车路径规划问题
服务器·前端·数据库
小屁孩大帅-杨一凡1 小时前
一个简单点的js的h5页面实现地铁快跑的小游戏
开发语言·前端·javascript·css·html
读心悦1 小时前
CSS 布局系统深度解析:从传统到现代的布局方案
前端·css
椒盐螺丝钉1 小时前
CSS盒子模型:Padding与Margin的适用场景与注意事项
前端·css
-SGlow-1 小时前
Linux相关概念和易错知识点(40)(HTML资源交互、网页管理、搜索引擎)
linux·运维·服务器·网络·html·交互
萧鼎2 小时前
构建全栈 Web 应用的新选择:NextPy 技术详解与实战指南
前端
purpleseashell_Lili2 小时前
配置别名路径 @
javascript·react
这个一个非常哈2 小时前
VUE篇之自定义组件使用v-model
前端·javascript·vue.js
purpleseashell_Lili3 小时前
react 基本写法
java·服务器·前端
哎哟喂_!3 小时前
Node.js 循环依赖问题详解:原理、案例与解决方案
前端·chrome·node.js