欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JS中的BOM操作解析

程序员文章站 2022-04-14 10:28:40
js中的bom操作 tips 1.bom简介 2.对话框 3.加载事件 4.location对象 5.history对象 6.navigator对象 tips 1.bom简介 javascript分...

js中的bom操作

tips

1.bom简介

2.对话框

3.加载事件

4.location对象

5.history对象

6.navigator对象

tips

1.bom简介

javascript分三个部分:

1. ecmascript标准---基本语法

2. dom--->document object model 文档对象模型,操作页面元素的

3. bom--->browser object model 对象模型,操作浏览器的

浏览器中有个*对象:window----皇上

页面中*对象:document-----总管太监

页面中所有的内容都是属于浏览器的,页面中的内容也都是window的,因为页面中的所有内容都是window的,window是可以省略的.

变量是window的

2.对话框

window.alert("您好啊");//以后不用,测试的时候使用

window.prompt("请输入帐号");

var result=window.confirm("您确定退出吗");

3.加载事件

只要页面加载完毕,这个事件就会触发-----页面中所有的内容,标签,属性,文本,包括外部引入js文件

window.onload=function () {

document.getelementbyid("btn").onclick=function () {

alert("您好");

};

};

很重要

onload=function () {

document.getelementbyid("btn").onclick=function () {

alert("您好");

};

};

扩展的事件---页面关闭后才触发的事件

window.onunload=function () {

};

扩展事件---页面关闭之前触发的

window.onbeforeunload=function () {

alert("哈哈");

};

4.location对象

location对象

console.log(window.location);

// //地址栏上#及后面的内容

// console.log(window.location.hash);

// //主机名及端口号

// console.log(window.location.host);

// //主机名

// console.log(window.location.hostname);

// //文件的路径---相对路径

// console.log(window.location.pathname);

// //端口号

// console.log(window.location.port);

// //协议

// console.log(window.location.protocol);

// //搜索的内容

// console.log(window.location.search);

//设置跳转的页面的地址

//location.href="https://www.jd.com";//属性----------------->必须记住

//location.assign("https://www.jd.com");//方法

//location.reload();//重新加载--刷新

//location.replace("https://www.jd.com");//没有历史记录

5.history对象

//跳转的

my$("btn1").onclick = function () {

window.location.href = "15test.html";

};

//前进

my$("btn2").onclick = function () {

window.history.forward();

};

6.navigator对象

//通过useragent可以判断用户浏览器的类型

console.log(window.navigator.useragent);

//通过platform可以判断浏览器所在的平台类型.

//console.log(window.navigator.platform);