js之事件,dom,动画

JS中存在三种对象:自定义对象 、 内置对象 、宿主对象

    宿主对象:js脚本执行环境所提供的对象,在这个阶段,js脚本在浏览器中执行,那么这里要讲的宿主对象就是浏览器对象

那么想要了解浏览器对象,就要了解浏览器对象模型;

浏览器对象模型:也就是BOM(Browser Object Model),用来进行窗口与窗口之间的通讯,这个可以看出来窗口是一个关键;
窗口对象:也就是Window对象,是BOM中的顶级对象,也可以看作是脚本中的全局对象window

    重点:BOM 浏览器对象模型     BOM的核心对象是window

window子对象:

document
History
Location
Navigator
Screen

window对象属性:

   innerHeight
   innerWidth
注意:上面两个属性获取浏览器的有效区域,不包含地址栏、工具栏、菜单栏

window对象常用方法:

窗口的打开与关闭:
open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。
通过window.open()创建的新窗口的Window对象具有opener属性,可以通过opener打开它的原始窗口,这样两个窗口之间就可以相互引用,
彼此之间可以读取对方的属性方法,而窗体也是一样;
close() 关闭当前页面

作用域:在 JavaScript 中, 作用域为可访问变量,对象,函数的集合。

 全局作用域: 变量在函数外定义,即为全局变量。       全局变量具有全局作用域: 网页中所有脚本和函数均可使用。 
        局部作用域: 变量在函数内声明,变量为局部作用域。   局部变量:只能在函数内部访问。因为局部变量只作用于函数内,所以不同的函数可以使用相同名称的变量。局部变量在函数开始执行时创建,函数执行完后局部变量会自动销毁。
        如果变量在函数内没有声明(没有使用 var 关键字),该变量为全局变量。
        JavaScript 变量生命周期 

        JavaScript 变量生命周期在它声明时初始化。 
        局部变量在函数执行完毕后销毁。全局变量在页面关闭后销毁。
        函数参数只在函数内起作用,是局部变量。

三种弹框

alert() 警告框
confirm()
确认框通常用于验证是否接受用户操作。
当确认弹框弹出时,用户可以点击 “确认” 或者 “取消” 来确定用户操作。
当你点击 “确认”, 确认框返回 true, 如果点击 “取消”, 确认框返回 false。
prompt()
提示框经常用于提示用户在进入页面前输入某个值。
当提示框出现后,用户需要输入某个值,然后点击确认或取消按钮才能继续操纵。
如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null。

Screen对象:包含有关客户端显示屏幕的信息

  	Screen对象属性
  			screen.availWidth  返回访问者屏幕的宽度(屏幕可用宽度,不含任务栏),以像素计
  			screen.availHeight 返回访问者屏幕的高度(屏幕可用高度,不含任务栏),以像素计
  			screen.colorDepth  返回用户浏览器表示的颜色位数,通常为32位(每像素的位数)
  			screen.pixelDepth  返回用户浏览器表示的像素位数,通常为32位(每像素的位数),低版本IE不支持此属性
  			screen.height	   返回访问者屏幕的高度,单位像素(屏幕分辨率的高)
  			screen.width	   返回访问者屏幕的宽度,单位像素(屏幕分辨率的宽)

Navigator对象:包含有关浏览器的信息

Navigator对象属性
navigator.appCodeName 浏览器代码名的字符串表示;注意,在所有以Netscape代码为基础的浏览器中,它的值是
“Mozilla”;为了兼容起见,在Microsoft的浏览器中,它的值也是 “Mozilla”
navigator.appName 返回浏览器的名称
navigator.platform 返回运行浏览器的操作系统的平台
重点:navigator.userAgent 返回由客户机发送服务器的user-agent头部的值(用户代理信息,通过该属性可以获取浏览器及操作系统信息)
navigator.language 返回操作系统使用的默认语言

History对象:包含用户(在浏览器窗口中)访问过的URL

history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能
History对象最初设计来表示窗口的浏览历史。但出于隐私方面的原因,History对象不再允许脚本访问已经访问过的实际URL。唯一保持使用的功能只有back()、forward()和go()方法
History对象属性
length 返回浏览器历史列表中URL的数量 History对象方法
history.back() 与浏览器中后退箭头作用相同(加载历史列表中的前一个 URL)
history.forward() 与浏览器中向前箭头作用相同(加载历史列表中的下一个 URL)
history.go(number) 根据当前所处的页面,加载 history 列表中的某个具体的页面,
如:history.go(-1)与history.back()作用相同;history.go(1)与 history.forward()作用相同;history.go(0)代表当前页面,参数若为其它数值代表相对当前页面的位置
Location对象:用于获取或设置当前页面的地址(URL),并把浏览器重定向到新的页面

Location对象属性

location.href 设置或返回当前页面完整的URL
location.protocol 返回所使用的web协议(http://或https://)
小贴士:http://与https://的区别详见课件资料(拓展自学)
location.host 设置或返回当前页面的主机名和URL的端口号
location.hostname 设置或返回当前页面的主机名
location.port 设置或返回当前页面的端口号
location.pathname 设置或返回当前页面的路径和文件名(文件所在路径,区别于href)

// 设置cookie

// document.c
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值