js中如何操作BOM对象？js中操作BOM对象的方法
本篇文章给大家带来的内容是关于js中如何操作BOM对象？js中操作BOM对象的方法，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
三个核心对象:
window:
[window].alert 只存在提示信息 alert(message)
[window].prompt 允许用户手动输入 var obj=prompt(message)
[window].confirm 帮助用户做判断 当用户点击确定的时候 返回true，
点击取消的时候 返回false
open(url) 打开指定的url地址
close() 关闭 当前的标签页
confirm.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>confirm弹层</title>
<script>
function del(){
var flag = confirm('您确定要删除吗？');
if(flag){
alert("拜拜");
} else{
alert("我们还嫩能够继续。");
}
} function toBaidu(){
open('https://www.baidu.com');
} </script></head><body>
<!--删除按钮-->
<!--<buttun onclick="javascript:confirm('您确定要删除吗？')">删除</buttun>-->
<buttun onclick="del()">删除</buttun>
<buttun onclick="toBaidu()">百度</buttun>
<a href="history.html">去history页面</a>
<button onclick="javascript:history.forward()">前进</button>
</body>
</html>success.html
<!DOCTYPE html><html><head lang="en">
<meta charset="UTF-8">
<title>欢迎页</title>
<script>
function closeThis(){
close('./success.html');
} </script></head><body>
<img src="./img/gaoyuanyuan.png" /> 欢迎您！
<button onclick="closeThis()">关闭</button>
</body>
</html>setTimeout(function(){},毫秒) 指定时间延迟操作 只操作一次
var i=setInterval(function(){},毫秒) 指定时间延迟操作 操作多次(每隔一段时间操作一次)
clearInterval(i) 清空定时特效
onload 事件:等待页面上的所有元素加载完毕timing.html
<!DOCTYPE html><html><head lang="en">
<meta charset="UTF-8">
<title>定时函数</title>
<script>
function print(){
setTimeout(
function(){
alert("我叫jhz");
},5000
);
}
print();
</script>
</head><body>
<input name="btn" type="button" value="定时" onclick="print();" />
</body>
</html><!DOCTYPE html><html><head lang="en">
<meta charset="UTF-8">
<title>定时函数</title>
<script>
window.onload=function(){
//保证页面上的元素加载完毕后
var btn=document.getElementsByTagName('button');
alert(btn); // 元素中的文本 innerText
alert(btn.innerText);
} </script>
</head><body>
<button id="btn">点击获取验证码</button></body></html>history.html
<!DOCTYPE html><html><head lang="en">
<meta charset="UTF-8">
<title>history对象</title></head><body>
<!--<button onclick="javascript:history.forward()">前进</button>-->
<button onclick="javascript:history.back()">后退</button>
</body>
</html>history:window
history:back() 回退===>go(-1)
forward() 前进 ===> go(1)
go(index) 即可前进 又可后退
注：这里的前进后退与浏览器上的前进后退按钮是一样的效果。
当我们从一个网页上访问一个链接后可以后退回网页，然后在网页上可以再次前进到刚才跳转的链接页面。（犹如连续的上一步和下一步似的）
location: window
host:主机地址+端口号
hostname:主机名
port:端口号
protocol:协议
href:发送请求到指定URL
reload() 刷新当前页面
replace(url) 替换 以新的页面替换当前页面location.html
<!DOCTYPE html><html><head lang="en">
<meta charset="UTF-8">
<title>location</title>
<script>
function toBaidu(){
//get请求
location.href="http://www.baidu.com"; Math
Date
} </script></head><body>
<button onclick="javascript:alert(location.host)">查看主机地址</button>
<button onclick="javascript:alert(location.hostname)">查看主机名</button>
<button onclick="javascript:alert(location.port)">查看端口</button>
<button onclick="javascript:alert(location.protocol)">查看协议</button>
<button onclick="javascript:alert(location.href)">查看href</button>
<button onclick="toBaidu()">去百度</button>
<button onclick="javascript:location.reload()">刷新</button>
<!--get请求-->
<button onclick="javascript:location.replace('http://www.baidu.com')">replace百度</button></body></html>—文档对象 XML
document.getXXX()
var obj=document.getElementById(“id属性值”) 根据页面元素的id获取元素对象 返回的是单个节点对象
—————————–返回的都是节点集合————————-
document.getElementsByName(“name属性值”)根据页面元素的name属性获取元素对象
document.getElementsByClassName("class属性值")
document.getElementsByTagName("节点名称")javascript的内置对象的函数
**Math对象:**
Math.ceil(number)向上取整
Math.floor(number) 向下取整
Math.round(number)四舍五入
Math.random() 生成0~1的随机数
**Date日期对象:**
getDate = function() {}; // 获取当前日期(天)
}
getDay = function() {}; //一周中的第几天
}
getMonth = function() {};// 一年中的第几月
}
getFullYear = function() {};// 返回年份 4位数
}
getHours = function() {}; //一天的第几个小时
}
getMilliseconds = function() {}; //获取毫秒 当前分钟
}
getMinutes = function() {};//分钟 当前小时
}
getSeconds = function() {}; //秒 当前分钟
}
getTime = function() {}; //时间 1970年1月1日 到现在的毫秒数date.html
<!DOCTYPE html><html><head lang="en">
<meta charset="UTF-8">
<title>date</title>
<script>
window.onload=function(){
var date = new Date();
alert(date.getDate());//获取当前日期(天)
alert(date.getDay());//一周中的第几天
alert(date.getMonth());//一年中的第几月 0-7（cong0开始）
alert(date.getFullYear());// 返回年份 4位数
alert(date.getHours());//一天的第几个小时
alert(date.getMilliseconds());//获取毫秒 当前分钟
alert(date.getMinutes ());//分钟 当前小时
alert(date.getSeconds ());//秒 当前分钟
alert(date.getTime());//时间 1970年1月1日 到现在的毫秒数
document.write("结束。");
} </script></head><body></body></html>相关推荐：
以上是js中如何操作BOM对象？js中操作BOM对象的方法的详细内容。更多信息请关注PHP中文网其他相关文章！
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！
热门文章
热工具
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3汉化版
中文版，非常好用
禅工作室 13.0.1
功能强大的PHP集成开发环境
Dreamweaver CS6
视觉化网页开发工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
神秘的JavaScript：它的作用以及为什么重要
Apr 09, 2025 am 12:07 AM
JavaScript是现代Web开发的基石，它的主要功能包括事件驱动编程、动态内容生成和异步编程。1)事件驱动编程允许网页根据用户操作动态变化。2)动态内容生成使得页面内容可以根据条件调整。3)异步编程确保用户界面不被阻塞。JavaScript广泛应用于网页交互、单页面应用和服务器端开发，极大地提升了用户体验和跨平台开发的灵活性。
谁得到更多的Python或JavaScript？
Apr 04, 2025 am 12:09 AM
Python和JavaScript开发者的薪资没有绝对的高低，具体取决于技能和行业需求。1.Python在数据科学和机器学习领域可能薪资更高。2.JavaScript在前端和全栈开发中需求大，薪资也可观。3.影响因素包括经验、地理位置、公司规模和特定技能。
如何使用JavaScript将具有相同ID的数组元素合并到一个对象中？
Apr 04, 2025 pm 05:09 PM
如何在JavaScript中将具有相同ID的数组元素合并到一个对象中？在处理数据时，我们常常会遇到需要将具有相同ID�...
JavaScript难以学习吗？
Apr 03, 2025 am 12:20 AM
学习JavaScript不难，但有挑战。1)理解基础概念如变量、数据类型、函数等。2)掌握异步编程，通过事件循环实现。3)使用DOM操作和Promise处理异步请求。4)避免常见错误，使用调试技巧。5)优化性能，遵循最佳实践。
如何实现视差滚动和元素动画效果，像资生堂官网那样？
或者：
怎样才能像资生堂官网一样，实现页面滚动伴随的动画效果？
Apr 04, 2025 pm 05:36 PM
实现视差滚动和元素动画效果的探讨本文将探讨如何实现类似资生堂官网（https://www.shiseido.co.jp/sb/wonderland/）中�...
console.log输出结果差异：两次调用为何不同？
Apr 04, 2025 pm 05:12 PM
深入探讨console.log输出差异的根源本文将分析一段代码中console.log函数输出结果的差异，并解释其背后的原因。�...
前端开发中如何实现类似 VSCode 的面板拖拽调整功能？
Apr 04, 2025 pm 02:06 PM
探索前端中类似VSCode的面板拖拽调整功能的实现在前端开发中，如何实现类似于VSCode...
