B/S学习之路—JavaScript学习笔记—第二天&DOM
来源:互联网 发布:right函数 vb 编辑:程序博客网 时间:2024/05/21 18:42
【DOM概述】
文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口。
【window、document、body的范围】
window:等同于浏览器,作用范围最大,在写javascript代码时可以省略window,如:window.alert()简写为alert()
document:是浏览器进行内容显示的区域,隶属于window
body:随里面写的标签以行的形式扩大范围
实例演示:在浏览器的文本框中实现数字每隔1秒自动加1
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script type="text/javascript"> onload = function () { setInterval(function () { document.getElementById('txt').value = parseInt(document.getElementById('txt').value) + 1; }, 1000); } </script></head><body> <input type="text" name="name" value="0 " id="txt" /></body></html>代码执行效果:
【页面加载三事件:onload、onunload、onbeforeunload】
(1)onload(页面加载完后触发)
浏览器是一边下载文档一边解析执行,可能会出现JavaScript执行时需要操作某个元素,而这个元素还没有加载,这样的话就需要将操作的代码放到onload事件中。
(2)onunload(页面卸载后触发)
网页关闭后触发,刷新页码或关闭选项卡时触发。
(3)onbeforeunload(页面卸载前触发)
在页面准备关闭前触发,可以进行一些信息的提示。
实例演示:点击浏览器中的按钮显示电脑的分辨率
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>家念想外在人的浪流</title> <script type="text/javascript"> onload =function () { document.getElementById('btn').onclick=function(){ alert(window.screen.width+','+window.screen.height); }; }; </script></head><body> <input type="button" name="name" value="显示电脑分辨率 " id="btn" /></body></html>代码执行效果:
【事件冒泡】
如果元素A嵌套在元素B中,那么A被点击不仅A的onclick事件会被触发,B的onclick事件也会被触发。
0 0
- B/S学习之路—JavaScript学习笔记—第二天&DOM
- B/S学习之路—DOM(1)
- B/S学习之路—DOM(2)
- B/S学习之路—DOM(3)
- B/S学习之路—DOM(4)
- B/S学习之路—JavaScript学习笔记—第一天&基本语法
- Javascript学习笔记之DOM
- JavaScript学习笔记之DOM
- javascript学习笔记之DOM
- 学习笔记——JavaScript操作DOM
- Javascript学习笔记07——DOM
- JavaScript学习笔记4——DOM
- JavaScript DOM学习笔记1——DOM节点层次
- JavaScript DOM学习笔记3——DOM属性操作
- JavaScript DOM学习笔记6——HTML DOM
- javascript学习笔记之二 ---DOM
- javascript学习笔记2之HTML DOM
- [学习笔记]JavaScript之DOM基础
- ZOJ 3777 Problem Arrangement(壮压dp)
- Machine Learning读书笔记
- 解决JSP路径问题的方法(jsp文件开头path, basePath作用)
- 采用dlopen、dlsym、dlclose加载动态链接库
- Linux下部署tomcat+mysql服务器
- B/S学习之路—JavaScript学习笔记—第二天&DOM
- 如何分析APP功能需求、结构
- AJAX开发初探
- 判断一棵树是否为AVL树
- Visual EmbedLinux Tools 更新到 0.1.7
- DICOM:DICOM3.0标准中文版开源书籍编辑之”github仓库合并“
- OOM详解
- 反转单链表
- Cocos2d-x 3.8.1 移植Android平台注意的细节问题