检查脚本打开的窗口是否关闭
摘要：index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> </head> <body> <button id="btn1">打开窗口</button> <button id="btn2">检测</button> <script
阅读全文
posted @ 2021-09-10 10:05
随笔分类 - BOM
减轻被恶意网站修改父窗口 URL 的风险
摘要：方法1：给 a 标签添加 rel 属性 <a href="https://an.evil.site" target="_blank" rel="noopener">恶意网站</a> 方法2：打开子窗口时将子窗口的 opener 设置为 null const newWin = window.open(
阅读全文
posted @ 2021-09-10 10:04
监听子窗口的聚焦与失焦
摘要：index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> </head> <body> <button onclick="clickHandler()">open: sub.html</button> <script> //
阅读全文
posted @ 2021-09-10 10:04
监听同一文档的浏览历史变动
摘要：window.onpopstate = function(res) { console.log(res) } 注意： pushState()或replaceState()不能触发该事件； 用户点击前进、后退，或 History.back()、History.forward()、History.go(
阅读全文
posted @ 2021-09-10 10:03
监听 hash 值变化
摘要：window.onhashchange = function (e) { console.log(e) } 如果pushState的 URL 参数设置了一个新的锚点值（即hash），并不会触发hashchange事件。反过来，如果 URL 的锚点值变了，则会在 History 对象创建一条浏览记录
阅读全文
posted @ 2021-09-10 10:01
获取在父窗口“联系”用 window.open 打开的子窗口
摘要：index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> </head> <body> <button onclick="clickHandler()">打开窗口</button> <script> function clic
阅读全文
posted @ 2021-09-10 09:57
获取网页加载到现在的毫秒数.md
摘要：index.js performance.now()
阅读全文
posted @ 2021-09-10 09:55
获取页面滚动距离
摘要：index.js window.scrollX window.scrollY window.pageXOffset // window.scrollX 别名 window.pageYOffset // window.scrollY 别名 注意：只读、初始为 0,0
阅读全文
posted @ 2021-09-10 09:55
获取浏览器组件属性对象
摘要：组件属性返回浏览器的组件对象，只读，只有 visible 属性，表示这些组件是否可见。 index.js window.locationbar.visible // 地址栏是否可见 window.menubar.visible // 菜单栏是否可见 window.scrollbars.visible
阅读全文
posted @ 2021-09-10 09:53
获取浏览器当前宽高
摘要：index.js window.outerHeight window.outerWidth 注意：包含浏览器菜单、边框、只读
阅读全文
posted @ 2021-09-10 09:52
获取当前页面一个 CSS 像素与一个物理像素之间的比率
摘要：index.js window.devicePixelRatio // 比例越大，表示诠释一个 CSS 像素所有的物理像素就越多，屏幕也就越高清
阅读全文
posted @ 2021-09-10 09:51
获取当前页面内所有框架窗口
摘要：index.js window.frames; // 返回类数组对象，元素包括 <frame> 和 <iframe>
阅读全文
posted @ 2021-09-10 09:50
获取当前页面视口（viewport）宽高
摘要：index.js window.innerHeight window.innerWidth 注意：返回当前页面可视区域宽高（不包含书签栏、搜索栏等）、页面放大时这对属性会变小、只读、包含滚动条宽高、对应 vw 和 vh 单位；
阅读全文
posted @ 2021-09-10 09:50
获取当前页面内框架窗口的数量
摘要：index.js window.frames.length window.length // true
阅读全文
posted @ 2021-09-10 09:49
获取窗口顶层对象
摘要：index.js window; // 最常用 window.self; // 别名 window.frames; // 别名 window.window; // 只读属性 window.parent; // 框架窗口中使用 window.top; // 框架窗口中使用
阅读全文
posted @ 2021-09-10 09:48
滚动到页面的指定位置
摘要：index.js window.scrollTo(x, y); // 绝对值滚动 window.scrollBy(x, y); // 相对值滚动 注意：如果不是要滚动整个文档，而是要滚动某个元素，可以使用：Element.scrollTop()、Element.scrollLeft()、Elemen
阅读全文
posted @ 2021-09-10 09:44
关闭`window.open()`打开的窗口
摘要：index.js function clickHandler() { const newWindow = window.open( "./sub.html", "_blank", "left=100,top=100,height=500,width=800" ); setTimeout(functi
阅读全文
posted @ 2021-09-10 09:42
JS 弹出阻塞性简单对话框
摘要：index.js window.alert('Hello! \n Lilei!')
阅读全文
posted @ 2021-09-09 10:47
js 弹出需要用户输入文本的对话框
摘要：index.js const res = window.prompt("What's your name?"); alert(`Your name is ${res}`);
阅读全文
posted @ 2021-09-09 10:40
