我iframe喜欢这个
<iframe name="myframe1" id="myframe1" width="100%" height="100%" src="a.html">
<html>
<head></head>
<frameset name="myframe2" cols="0%, 100%" border="0" frameBorder="0" frameSpacing="0">
<frame name="page1" src="c.html" scrolling="no"></frame>
<frame name="page2" src="d.html" >
<html>
<head></head>
<body id="top">
<div id="div1">
<div id="div2">
<div id="div3">
<ul id="x">
<li>a</li>
<li>b</li>
</ul>
</div>
</div>
</div>
</body>
</html>
</frame>
</frameset>
</html>
</iframe>
Run Code Online (Sandbox Code Playgroud)
我想引用元素"x".我尝试了几种方法,但我找不到解决方案.
我是HTML5的新手,我做了一些研究,发现使用<frameset>已经过时,而且我读过<iframes>的不是.那么有人可以帮助我,我想获得与所示示例相同的结果但是在使用<iframes>或替代<frameset>它时,HTLM5中没有弃用?
<frameset cols="20%,*,">
<frame src="menu.html">
<frame src="events.html">
</frameset>
Run Code Online (Sandbox Code Playgroud) 我需要从框架集框架中访问和元素.例如,如果我有以下标记:
<frameset rows="33%,33%,*">
<frame src="frame1.html"/>
<frame src="frame2.html"/>
<frame src="frame3.html"/>
</frameset>
Run Code Online (Sandbox Code Playgroud)
如何从其中一个子框架中获取某些元素?我试过这个:
window.frames[1].getElementById('someElementId')
Run Code Online (Sandbox Code Playgroud)
这会导致类型错误:
getElementById()不是函数.
有人可以帮忙吗?
谢谢!
自1998年以来我没有使用过框架.它们看起来是个坏主意,在我的所有开发中,我从未遇到过框架是正确的解决方案,甚至是一个不错的解决方案.
但是,我现在正在使用由另一个组编写的内部Web应用程序,整个站点都是在 - 标题,左侧菜单,右侧内容 - 框架集中构建的.
首先,当VPN到我的网络时,我不断找到"website.com/frames.html"找不到."错误信息.当我在内部网络上时,这不会发生.
其次,该应用程序具有内置的电子邮件/消息系统.未读消息的数量在左侧菜单框中显示为"消息(3)",但在读取消息时计数不会更新.开发人员告诉我,因为它在一个框架中我需要右键单击菜单并"刷新".认真????
所以,我的编程相关问题是,你有什么理由不在网站中使用框架?
我有一个具有嵌套框架集的文档.我需要访问其中一个名为"sq_main"的嵌套框架,并访问此框架内的内容.这是我的结构:
<html>
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<frameset rows="28,*" frameborder="0" border="0">
<frame src="/_admin/?SQ_BACKEND_PAGE=header" name="sq_header" scrolling="no" marginwidth="0" marginheight="0">
<frameset cols="380,10,*" frameborder="0" border="0" id ="main_frameset">
<frame src="/_admin/?SQ_BACKEND_PAGE=sidenav" name="sq_sidenav" scrolling="no" marginwidth="0" marginheight="0">
<frame src="/_admin/?SQ_BACKEND_PAGE=resizer" name="sq_resizer" scrolling="no" marginwidth="0" marginheight="0">
<frame src="/_admin?SQ_BACKEND_PAGE=main&assetid=43&sq_from_frontend=1" name="sq_main" marginwidth="0" marginheight="0" scrolling="yes">
</frameset>
</frameset>
<noframes></noframes>
</html>
Run Code Online (Sandbox Code Playgroud)
遗憾的是,我无法更改代码,这就是我需要使用jQuery访问它的原因.我试图编写一个jQuery选择器来访问"sq_main"框架,但到目前为止没有运气:
$('body', parent.frames[0].sq_main).prepend('<h1>TEST!!!!</h1>');
Run Code Online (Sandbox Code Playgroud)
关于如何深入挖掘这个丑陋结构的想法?:)
我正在将客户端的网站从框架集转换为div.客户端具有的一个功能是侧边栏,可以根据用户需要的空间大小调整大小.使用框架内置了这个侧边栏的大小调整.但是,我在jQuery中模拟这个功能有些困难.
我不希望使用jQuery UI来实现这一点,我不需要UI套件提供的所有额外功能,而只是编写几行代码来处理这个问题.
我只需要在水平面上调整大小,垂直尺寸是固定的.
目前我有一个(某种程度)有效的解决方案.侧栏div可以调整大小,但只有当用户点击可调整大小的div时,拖动鼠标,然后再次单击div(删除mousemove事件).
我想要的体验是:用户将鼠标悬停在可调整大小的div上,按下鼠标按钮,然后将div拖动到更大/更小,然后释放按钮.
我遇到的问题是:如果用户点击我的可调整大小的div,然后尝试拖动它使其变小/变大,鼠标变为"否"图标,并且我的div的透明版本是药物周围用鼠标.
也许通过查看我的代码可以更好地解释这一点:
$(document).ready(function() {
var i = 0;
$('#dragbar').mousedown(function(){
$('#mousestatus').html("mousedown" + i++);
$(document).mousemove(function(e){
$('#position').html(e.pageX +', '+ e.pageY);
$('#sidebar').css("width",e.pageX+2);
})
console.log("leaving mouseDown");
});
$(document).mouseup(function(){
$('#clickevent').html('in another mouseUp event' + i++);
$(document).unbind('mousemove');
});
});
Run Code Online (Sandbox Code Playgroud)
和HTML:
<div id="header">
header
<span id="mousestatus"></span>
<span id="clickevent"></span>
</div>
<div id="sidebar">
<span id="position"></span>
<div id="dragbar">
</div>
sidebar
</div>
<div id="main">
main
</div>
<div id="footer">
footer
</div>
Run Code Online (Sandbox Code Playgroud)
这是一个基本布局工作的临时网页:
http://pastehtml.com/view/1crj2lj.html
如果您尝试使用棕色条调整标记为"侧边栏"的内容,则可以看到问题.
我正在开发一个基于和标签的方便项目.
这是父页面的常见HTML结构(index.html):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
</head>
<frameset rows="75px,*" frameborder="0">
<frame name="frame1" src="frames/frame1.html">
<frameset class="child_frameset">
<frame name="frame3" src="frames/frame3.html">
</frameset>
</frameset>
</html>
Run Code Online (Sandbox Code Playgroud)
我在这里如何指定子框架上的javascript函数(frame3.html):
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript">
function helloWorld(){
alert('hello world!');
}
</script>
</head>
<body>
<h1>I'm frame 3</h1>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我的任务是调用helloWorld()函数.我怎么做?
提前致谢!
我有一个框架集,在一个框架中有一个按钮,将其父框架集最小化到一定的大小.
代码可以工作,但问题是如果我选择先用鼠标手动调整框架,然后按最小化按钮,它将在IE8和Chrome中错误地调整大小.它在FF中正确调整大小.
我有这个HTML结构
...
<frameset cols="32%,*" border="2" frameborder="1" framespacing="1">
<frameset rows="350,*" border="2" frameborder="1" framespacing="1" id="searchResultFrameset">
<!-- The minimize button are in this frame searchResultFrame -->
<frame name="searchResultFrame" scrolling="no" src="dummy">
<frame name="itemFrame" frameborder="1" scrolling="no" id="itemFrame" src="dummy2"></frameset>
<frame name="contentFrame" frameborder="0" scrolling="yes" id="contentFrame" src="dummy3">
</frameset>
...
Run Code Online (Sandbox Code Playgroud)
以及按下按钮时执行的代码.
// Minimize frame button
$('.minimizeFrame').toggle(function () {
parent.document.getElementsByTagName('frameset')[1].setAttribute('cols','22,*');
}, function () {
parent.document.getElementsByTagName('frameset')[1].setAttribute('cols','32%,*');
});
Run Code Online (Sandbox Code Playgroud)
我可以看到开发人员工具中的cols="32%,*"更改cols="22,*",但仍然以错误的大小呈现.
为什么鼠标更改后调整不正确?我错过了什么或是浏览器中的错误?或者是否有可能在没有此错误的情况下调整框架大小的替代解决方案?
例
我一直在寻找超过1小时没有成功.是否有一种模仿框架集的纯CSS方式?我的意思是,真的模仿它.我发现了一些有趣的东西,你将有固定的顶部和底部块,但内容的滚动条是常规的浏览器主体滚动条.我需要的只是内容块的滚动条,就像框架集一样.
我可以通过将overflow:auto指定给我的内容区域div并设置固定高度来使其工作.但问题是我不知道客户端浏览器窗口大小而不使用javascript.而且我不想为此使用javascript.我也使用百分比作为高度,因为我的顶部块具有固定的高度.下部块是应根据浏览器窗口高度扩展或缩小的块.任何帮助赞赏.谢谢!