前置script问题、js bom操作

最新推荐文章于 2025-02-18 17:52:54 发布

原创最新推荐文章于 2025-02-18 17:52:54 发布 · 166 阅读

CC 4.0 BY-SA版权

博客介绍了window.onload的用法，当js代码获取页面元素且script标签在元素前时需加window.onload，反之则不用。还提及了BOM（浏览器对象模型），包括window的方法、属性，如弹窗、关闭和打开页面、动态创建DOM元素，以及获取浏览器宽高、可视区域宽高等操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

window.onload的用法

因为页面中的代码一般情况下按照，从上到下，从左到右的顺序执行。
所以当js代码需要获取页面中的元素时，如果script标签在元素的前面，需要加window.onload；如果script放在了元素后面，就不需要加 window.onload。
如下是前置的情况

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<script>
    window.onload=function(){
    }
</script>
</body>
</html>

这是不需要前置的情况

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

</body>
<script>

</script>
</html>

1、bom称为浏览器对象模型。
window.alert();在window里面的方法或者属性可以省略前面的window。
以下代码在浏览器中出现弹框显示确定删除！点是输出1，点否输出2

if(confirm("确定删除！")){
     alert("1");
     }
     else{
     alert(2);
     }

关闭当前页面

window.close();

打开一个页面。

 window.open("./***.html")*/
***.html是要打开的页面

动态创建dom元素

var a = document.createElement(“a”);
a.innerHTML = “5”;
a.className = “block”；

随机  10-20
console.log(Math.random()*10+10);
向下 取整
console.log(Math.floor(1.2));
输出是1
向上取整
console.log(Math.ceil(1.2));
输出是2
四舍五入
console.log(Math.round(4.5));
输出是5
开平方
console.log(Math.sqrt(3));
次幂
console.log(Math.pow(2,3));
输出8，二的三次方
console.log(Math.PI);
输出圆周率
以下三个是三角函数。
console.log(Math.sin(Math.PI));
console.log(Math.cos(Math.PI));
console.log(Math.tan(Math.PI/4));

获取浏览器的宽、高
工作区高不包含任务栏
window.screen.availHeight
window.screen.availWidth 宽
window.screen.width 宽
window.screen.height 实际高包含任务栏
获取可视区域宽、高
console.log(document.documentElement.clientWidth);
console.log(document.documentElement.clientHeight);