html onclick呼出controller方法_html的js学习-浏览器对象模型概念学习

1. BOM编程

02be7ad58f30a343dfa682deaae98177.png

1.1. BOM编程基础

全称 Browser Object Model,浏览器对象模型。

JavaScript是由浏览器中内置的javascript脚本解释器程序来执行javascript脚本语言的。

为了便于对浏览器的操作,javascript封装了对浏览器的各个对象使得开发者可以方便的操作浏览器。

1.2. BOM对象:

1.3. window 对象

Window 对象是 JavaScript 层级中的顶层对象。

Window 对象代表一个浏览器窗口或一个框架。

Window 对象会在

或 每次出现时被自动创建。

1.3.1. window中的方法

document 对 Document 对象的只读引用

location 用于窗口或框架的 Location 对象

history 对 History 对象的只读引用。

document.tilte 设置网页的标题

moveto() 将窗口左上角的屏幕位置移动到指定的 xy 位置。

moveby() 相对于目前的位置移动。

resizeTo() 调整当前浏览器的窗口。

open() 打开新窗口显示指定的URL(有的浏览器中是打一个新的选项卡)

setTimeout(vCode, iMilliSeconds) 超时后执行代码。

setInterval(vCode, iMilliSeconds) 定时执行代码,第一次也是先等待,到时再执行。setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数

2. 事件

a32b78a7f7dedb8a79b1e66bd326e16a.png

a) 事件说明

基本上所有的HTML元素中都可以指定事件属性。

每个元素支持什么样事件应查询文档。

所有的事件属性都是以on开头,后面的是事件的触发方式,如:

onclick,表示单击

onkeydown,表示键按下

...

b) 常用的事件类型:

鼠标点击相关:

onclick 在用户用鼠标左键单击对象时触发。

ondblclick 当用户双击对象时触发。

onmousedown 当用户用任何鼠标按钮单击对象时触发。

onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。

鼠标移动相关:

onmouseout 当用户将鼠标指针移出对象边界时触发。

onmousemove 当用户将鼠标划过对象时触发。

焦点相关的:

onblur 在对象失去输入焦点时触发。

onfocus 当对象获得焦点时触发。

其他:

onchange 当对象或选中区的内容改变时触发。

onload 在浏览器完成对象的装载后立即触发。

onsubmit 当表单将要被提交时触发。

location 对象

Location 对象是由 JavaScript runtime engine 自动创建的,包含有关当前 URL 的信息。

location中的重要方法:

href属性 设置或获取整个 URL 为字符串。

reload() 重新装入当前页面

1.3.2. screen 对象

Screen 对象是由 JavaScript runtime engine 自动创建的,包含有关客户机显示屏幕的信息。

属性:

availHeight 获取系统屏幕的工作区域高度,排除 Microsoft Windows 任务栏。

availWidth 获取系统屏幕的工作区域宽度,排除 Windows 任务栏。

height 获取屏幕的垂直分辨率。

width 获取屏幕的水平分辨率。

示例:

document.write("屏幕工作区: " + screen.availHeight + ", " + screen.availWidth + "
");

document.write("屏幕分辨率: " + screen.height + ", " + screen.width + "
");

1.3.3. document对象

该对象代表整个文档页面

对象的集合:

all 获取页面所有元素对象

forms 获取页面所有表单对象

images 获取页面所有图片对象

links 获取所有超链接或area对象

具体的内容会在学习DOM时学习。

72d55627bb181ab8afdd4702601bfd5a.png
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值