ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

JS day09—BOM

2021-09-17 16:33:01  阅读:175  来源: 互联网

标签:day09 元素 页面 JS write window location document BOM


1.BOM

Broswer Object Mode(浏览器对象模型)

    结论:所有的属性和方法在被调用时,必须有前缀

            凡是省略前缀的属性和方法,它的父级对象都是window

             全局变量和方法的父级元素都是window

2.window的三个弹出框:

window对象常用的属性和方法:

三个弹出框: 特点阻塞代码执行

alert("内容")   弹出框

confirm("提示信息")  确认框   确定返回true 取消返回false

prompt("提示信息","默认值")    输入框 返回数值为字符串 

3.window的一个事件:

onload:延迟加载,必须在页面其他模块加载完毕后在执行事件体的代码

window.onload = function(){

        console.log("页面加载完成");

    }

    console.log("页面正在加载");

解决问题:

script可以写在html的任意位置,当body中写入代码,当在tml下面写script则没有任何问题

    但当写在head中时则会出现报错:因为代码是自上而下的运行的。则需要加入.onload来解决。

4.location:地址对象

属性的读写:

  1.href地址的读写:

读:

location.href

写:

location.href ="地址";

当前页面地址 读
	     document.write(location.href);
页面在三秒后跳到外网
    setTimeout(function(){
       location.href = "http://www.baidu.com";
        },3000);

  2.replace(替换的网站):

读:

location.replace

写:

location.replace("地址");

location.replace("url")//加地址则会跳转到该地址所在页面
	 //location.replace("index.html");
	location.replace("http://www.baidu.com");   覆盖原先网页 没有浏览痕迹

3.reload:刷新

5.history:对象用户访问过的url

 1.back()  加载history列表的前一个url

  2.forward()   加载history列表的后一个url

  3.go()  history列表的某一个具体页面

6.document:文档对象

每个载入浏览器的 HTML 文档都会成为 Document 对象。

document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问

document 对象是 window 对象的一部分,可通过 window.document 属性对其进行访问

 1.write:

作用1:

字符串解析:能转换成html元素的则转换,转换不了的就原样返回

document.write("<br>");//换行
	    document.write("laolv");//输出laolv
	    document.write("<font color='#FF69B4'>" + "heihei" + "</font>");//输出粉色的heihei

作用2:

当write与事件连用时, 会直接覆盖原页面

	 var oBtn = document.getElementById("test");//获取body里id为test的元素
		
		 	oBtn.onclick = function(){
		 		document.write("xixi");
			}

7.获取HTML元素的方法:

  1.getElementById("id名")

      返回id所对应的单个元素

  2.getElementsByTagName("标签名")

     批量返回标签所对应元素,存放在数组中

  3.getElementsByClassName("类名")

  批量返回类名对应的元素,存放在数组中

  4.getElementsByName("name名")

  批量返回name名所对应的元素,存放在数组中

  5.querySelector("选择器")

   通过选择器来获取单个元素(标签,类,id)

  6.querySelectorAll("选择器")

   通过选择器来批量获取元素,存放在数组中(标签,类)

标签:day09,元素,页面,JS,write,window,location,document,BOM
来源: https://blog.csdn.net/qq_48991522/article/details/120340065

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有