击右上方红色按钮关注“小郑搞码事”,每天都能学到知识,搞懂一个问题!
大家好!我是/小郑搞码事/的小郑
今天和大家分享一下JS如何操作浏览器窗口。只讲如何打开一个新窗口
先来看效果图
上面这个图界面效果就是我们要实现的。
我们常常需要创建一个新窗口,用来向用户显示额外的信息,同时又避免他们正在阅读的信息消失。从实现方案上来看,尽管我们可以用HTML打开一个新的浏览器窗口,但是使用JavaScript可以对新窗口的内容和特性进行更多的控制。
接下来,我们看一下怎么实现的
定义一个打开新窗口的函数newWindow。如上面代码所示,变量catWindow包含一个新的窗口对象,这个对象引用图像文件icon.png,这个新窗口的名称是catWin,必须设置名称,因为我们以后可能希望在a或另一个脚本中引用这个窗口。新窗口的宽度是350像素,高度是260像素,位置是左边400,上边400。
页面中,包含一个onload事件处理程序,它调用newWinLinks函数,newWinLinks循环遍历页面上的a,检查是否有任何a包含class属性值newWin。如果有,就设置这个a元素的onclick事件处理程序,从而,当点击这个a时,调用newWindow函数。
总结一下
需要注意两个地方:
1、newWindow中,在宽度和高度参数中的逗号之间不能有任何空格,如果有空格,那么脚本可能在某些浏览器中无效,总地来说,当脚本出现错误,需要进行高度时,要首先查找这样的小问题。
2、比如向窗口中添加参数时,希望窗口具有工具栏,地址栏,滚动条
toolbar=yes,location=yes,scrollbars=yes
参数默认是no,可以不填。当然浏览器上表现也有不同,需要知道。
、警告框(alert / window.alert)
alert("文本");
警告框经常用于确保用户可以得到某些信息。
当警告框出现后,用户需要点击确定按钮才能继续进行操作。
2、确认框(confirm / window.confirm)
confirm("文本")
确认框用于使用户可以验证或者接受某些信息。
当确认框出现后,用户需要点击确定或者取消按钮才能继续进行操作。
如果用户点击确认,那么返回值为 true。如果用户点击取消,那么返回值为 false。
prompt(text,defaulText);输入文字对话框,text:对话框显示纯文本(而不是HTML格式文本);defaultText,默认文本。
3、提示框(prompt / window.prompt)
prompt("文本","默认值")
提示框经常用于提示用户在进入页面前输入某个值。
当提示框出现后,用户需要输入某个值,然后点击确认或取消按钮才能继续操纵。
如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null。
注:弹出框换行用“ /n ”;
4、console.log();控制台打印内容;
推荐阅读:
JavaScript基础知识系列:不再彷徨:完全弄懂JavaScript中的this
面试:JavaScript基础篇
JavaScript基础知识系列:判断类型(上)
js 中原型和原型链深入理解
图1
图2
图3
*请认真填写需求信息,我们会在24小时内与您取得联系。