Web Front-end
JS Tutorial
JavaScript Advanced Programming Reading Notes (15) JavaScript_javascript skills in browsers
JavaScript Advanced Programming Reading Notes (15) JavaScript_javascript skills in browsers
Window对象
窗口操作
Window对象对操作浏览器窗口非常有用，开发者可以移动或调整浏览器窗口的大小。可用四种方法实现这些操作：
moveBy(dx,dy)：把浏览器窗口相对当前位置水平移动dx个像素，垂直移动dy个像素。dx值为负左移，dy为负上移。
moveTo(x,y)：移动浏览器窗口，使它的左上角位于用户屏幕的(x,y)处。可以使用负数，不过这样会把部分窗口移出屏幕的可视区域。
resizeBy(dw,dh)：相对浏览器窗口当前大小，把窗口的宽度调整dw个像素，高度调整dy个像素。dw、dy为负时缩小窗口。
resizeTo(w,h)：把窗口的宽度调整为w，高度调整为h，不能使用负数。
注，FireFox跟Chrome默认不允许进行此操作，要在安全设置里更改
效果(在IE浏览器中有效果)：
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
导航和打开新窗口
导航和打开新窗口用 window.open() 方法，该方法接受四个参数，即要载入新窗口的页面的URL，新窗口名字，特性字符串和说明是否用新载入的页面替换当前载入的页面的Boolean值。一般只用前三个参数，最后一个参数只有在window.open()打不开新窗口时才有效。
第三个参数可选值如下：
top=pixels窗口的 y 坐标。
| left=pixels | 窗口的 x 坐标。以像素计。 |
| height=pixels | 窗口文档显示区的高度。以像素计。 |
| width=pixels | 窗口的文档显示区的宽度。以像素计。 |
| resizable=yes|no | 窗口是否可调节尺寸。默认是 yes。 |
| scrollable=yes|no | 是否显示滚动条。默认是 yes。 |
| location=yes|no | 是否显示地址字段。默认是 yes。 |
| status=yes|no | 是否添加状态栏。默认是 yes。 |
| toolbar=yes|no | 是否显示浏览器的工具栏。默认是 yes。 |
特性字符串是以逗号分隔的，所以在逗号或等号后不能有空格。
示例：
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
document对象
用document的open、write、close等方法可以向新打开的窗口中写入内容，如下所示：
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
1392
52
How to correctly display the locally installed 'Jingnan Mai Round Body' on the web page?
Apr 05, 2025 pm 10:33 PM
Using locally installed font files in web pages Recently, I downloaded a free font from the internet and successfully installed it into my system. Now...
How to control the top and end of pages in browser printing settings through JavaScript or CSS?
Apr 05, 2025 pm 10:39 PM
How to use JavaScript or CSS to control the top and end of the page in the browser's printing settings. In the browser's printing settings, there is an option to control whether the display is...
Why does negative margins not take effect in some cases? How to solve this problem?
Apr 05, 2025 pm 10:18 PM
Why do negative margins not take effect in some cases? During programming, negative margins in CSS (negative...
How to use locally installed font files on web pages?
Apr 05, 2025 pm 10:57 PM
How to use locally installed font files on web pages Have you encountered this situation in web page development: you have installed a font on your computer...
The text under Flex layout is omitted but the container is opened? How to solve it?
Apr 05, 2025 pm 11:00 PM
The problem of container opening due to excessive omission of text under Flex layout and solutions are used...
How to achieve horizontal scrolling effect of horizontal options by rotating elements in CSS?
Apr 05, 2025 pm 10:51 PM
How to achieve horizontal scrolling effect of horizontal options in CSS? In modern web design, how to achieve a horizontal tab-like effect and support the mouse...
There are gaps in three divs in the Vant Popup component: What CSS style is causing it?
Apr 05, 2025 pm 11:12 PM
Vante...
How to solve the height problem by adjusting the rem unit in adaptive design?
Apr 05, 2025 pm 11:03 PM
How to solve the height adjustment problem in adaptive design? In adaptive design, height adjustment is often a difficult problem. Especially when dealing with similar...
