HTML_DOM学习
HTML DOM 树
通过ID/类名/标号可以定位HTML元素,然后可用JS改变这些元素的样式内容,并对DOM事件作出反应
对HTML事件的响应:
onmousedown 和onmouseup/onclick:鼠标的长按与释放/单击
onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数
onload 和 onunload: 事件可用于处理 cookie
resize:重置浏览器事件(向winwows添加事件句柄)。
onfocus、onchange 事件:输入字段获得焦点、和失去焦点后。
添加和删除事件的侦听:element.addEventListener(event, function, useCapture);
removeEventListener():
早期的一些浏览器不支持的用以下替代:element.attachEvent(event, function);element.detachEvent(event, function);
如document.getElementById("myBtn").addEventListener("click", displayDate);//注意事件用click而不能用onclick
事件传递的顺序:冒泡(内部先触发,在触发外部)和捕获(外部先触发,在触发内部),即useCapture参数:默认值为 false, 即冒泡传递,用在当<p>夹在<div>中间时的触发先后顺序问题。
节点文本的添加(在前添加、在后添加)、删除、和替换:
添加:var para = document.createElement("p");
var node = document.createTextNode("这是一个新的段落。");
para.appendChild(node);//p和内容的绑定
var element = document.getElementById("div1");//查找一个已有元素
element.appendChild(para);//在一个已有的元素容器中添加新的元素
var child = document.getElementById("p1");
element.insertBefore(para, child);/*在一个已有元素容器的某个元素的前面添加*/
parent.removeChild(child);/*删除某个指定元素*/
或不用父节点的删除child.parentNode.removeChild(child);
parent.replaceChild(para, child);//用新创建的某个元素替换已有的某个元素
通过
最新文章
- 【React】启动dva脚手架
- JS(去掉前后空格或去掉所有空格)的用法
- 关于WEB Service&;WCF&;WebApi实现身份验证之WebApi篇
- Button的enabled和clickabled的区别
- http服务器返回状态代码含义
- Excel 函数
- jquery调用页面的方法
- Mongodb 安装 以及 问题解决-摘自网络
- js闭包简要分析
- 平时的笔记02:处理fnmatch模块
- Hadoop伪分布式搭建步骤
- 积累的VC编程小技巧之树操作
- 《C++游戏开发》笔记十三 平滑过渡的战争迷雾(一) 原理:Warcraft3地形拼接算法
- [J2EE] 有关 PreparedStatement
- configure:cannot guess build type; you must specify one
- pytorch torchvision.ImageFolder的使用
- 2018铁三测评题write以及一些想送给你们的话
- ASP.NET Core MVC中URL和数据模型的匹配
- jQuery设置div的自适应布局
- Tomcat虚拟目录设置
热门文章
- 前端总结&#183;基础篇&#183;JS(一)原型、原型链、构造函数和字符串(String)
- excel导出工具
- c# 时间格式处理,获取格式: 2014-04-12T12:30:30+08:00
- CS基本网络中Agent使用双网卡进行流量划分
- oracle select非group by的字段
- SP839 Optimal marks(最小割)
- 数据结构19: BF算法(普通模式匹配算法)
- JS基础学习四:绑定事件
- CF959E Mahmoud and Ehab and the xor-MST 思维
- Python的安装位置与Python库