- 使用JavaScript直接在iframe中指定div不显示的方法:
在iframe框架中使用JavaScript来控制指定div元素的display属性,让其不显示。可以使用以下的代码实现:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>iframe demo</title>
<style>
#myDiv {
display: block;
width: 200px;
height: 200px;
background-color: #f00;
}
</style>
</head>
<body>
<h1>主页</h1>
<iframe src="iframe.html" width="100%" height="500px"></iframe>
</body>
<script>
window.onload = function() {
var iframe = document.getElementsByTagName('iframe')[0];
var iframeWindow = iframe.contentWindow || iframe.contentDocument.parentWindow;
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
var myDiv = iframeDocument.getElementById('myDiv');
myDiv.style.display = 'none';
}
</script>
</html>
这里我们在iframe父窗口的JavaScript代码中获取到iframe窗口的window对象和document对象,然后获取要操作的div元素myDiv,最后将其display样式属性设置为none。
- 使用jQuery框架在iframe中指定div不显示的方法:
在iframe框架中使用jQuery框架来控制指定div元素的display属性,让其不显示。可以使用以下的代码实现:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>iframe demo</title>
<script src="//cdn.bootcss.com/jquery/3.5.1/jquery.js"></script>
<style>
#myDiv {
display: block;
width: 200px;
height: 200px;
background-color: #f00;
}
</style>
</head>
<body>
<h1>主页</h1>
<iframe src="iframe.html" width="100%" height="500px"></iframe>
</body>
<script>
$(function() {
$('iframe').contents().find('#myDiv').hide();
});
</script>
</html>
这里我们在iframe父窗口的jQuery代码中使用contents()方法获取到iframe的文档对象,然后使用find()方法找到要操作的div元素myDiv,最后使用hide()方法将其隐藏。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:js如何设置在iframe框架中指定div不显示 - Python技术站