频道栏目
首页 > 程序开发 > web前端 > JavaScript教程 > JS 实例 > 正文
Window 对象(3)
2016-01-26 14:30:16           
收藏   我要投稿
传输一些文本到源(父)窗口

源代码

<!DOCTYPE html>
<html>
<head>
<script>
function openWin()
{
myWindow=window.open('','','width=200,height=100');
myWindow.document.write("<p>This is 'myWindow'</p>");
myWindow.focus();
myWindow.opener.document.write("<p>This is the source window!</p>");
}
</script>
</head>
<body>

<input type="button" value="Open 'myWindow'" onclick="openWin()" />

</body>
</html>

 

运行结果

\

相对于当前位置移动新窗口

源代码

<!DOCTYPE html>
<html>
<head>
<script>
function openWin()
{
myWindow=window.open('','','width=200,height=100');
myWindow.document.write("<p>This is 'myWindow'</p>");
}

function moveWin()
{
myWindow.moveBy(250,250);
myWindow.focus();
}
</script>
</head>
<body>

<input type="button" value="Open 'myWindow'" onclick="openWin()" />
<br><br>
<input type="button" value="Move 'myWindow'" onclick="moveWin()" />

</body>
</html>

 

运行结果

\

移动新窗口到指定位置

源代码

<!DOCTYPE html>
<html>
<head>
<script>
function openWin()
{
myWindow=window.open('','','width=200,height=100');
myWindow.document.write("<p>This is 'myWindow'</p>");
}

function moveWin()
{
myWindow.moveTo(0,0);
myWindow.focus();
}
</script>
</head>
<body>

<input type="button" value="Open 'myWindow'" onclick="openWin()" />
<br><br>
<input type="button" value="Move 'myWindow'" onclick="moveWin()" />

</body>
</html>

 

运行结果

\

打印当前页面

源代码

<!DOCTYPE html>
<html>
<head>
<script>
function printpage()
{
window.print();
}
</script>
</head>
<body>

<input type="button" value="Print this page" onclick="printpage()" />

</body>
</html>

 

运行结果

\

用像素指定窗口大小

源代码

<!DOCTYPE html>
<html>
<head>
<script>
function resizeWindow()
{
top.resizeBy(100,100);
}
</script>
</head>

<body>
<form>
<input type="button" onclick="resizeWindow()" value="Resize window">
</form>
<p><b>Note:</b> We have used the <b>top</b> element instead of the <b>window</b> element, because we use frames. If you do not use frames, use the <b>window</b> element instead.</p>
</body>

</html>

 

运行结果

\

指定窗口大小

源代码

<!DOCTYPE html>
<html>
<head>
<script>
var w;
function openwindow()
{
w=window.open('','', 'width=100,height=100');
w.focus();
}

function myFunction()
{
w.resizeTo(500,500);
w.focus();
}

</script>
</head>
<body>

<button onclick="openwindow()">Create window</button>
<button onclick="myFunction()">Resize window</button>

</body>
</html>

 

运行结果

\

由指定的像素数滚动内容

源代码

<!DOCTYPE html>
<html>
<head>
<script>
function scrollWindow()
{
window.scrollBy(100,100);
}
</script>
</head>
<body>


<input type="button" onclick="scrollWindow()" value="Scroll" />
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

</body>
</html>

 

运行结果

 

\
点击复制链接 与好友分享!回本站首页
相关TAG标签 对象
上一篇:Window 对象(2)
下一篇:Window 对象(4)
相关文章
图文推荐
点击排行

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站