第三阶段——jS——webApi编程——DOM

jS——webApi编程——DOM

基本内容：
https://www.cnblogs.com/AFBF/p/14289898.html

DOM:
https://www.cnblogs.com/AFBF/p/14289936.html

BOM
https://www.cnblogs.com/AFBF/p/14289964.html

移动端+JQuery+js面向对象
https://www.cnblogs.com/AFBF/p/14289973.html

Dom内容

获取网页元素

image-20210102162454238

根据id获取

image-20210102162531438

image-20210102162724002

image-20210102162835779

根据标签名获取

image-20210102162923771

image-20210102163727486

H5新增方法获取（考虑兼容问题）

image-20210102163835416

image-20210102163901622

image-20210102164029172

image-20210102164101790

image-20210102164142824

获取boy html

image-20210102164254164

事件基础

image-20210102164624413

常见的鼠标事件

image-20210102164824072

操作元素

image-20210102170247587

image-20210102192650761

样式属性修改

记得用this

image-20210102201646600

image-20210102204009106

image-20210102204215974

image-20210102204139560

image-20210102204351554

这里的first是旧的类名 change是新的类名

新的方法获取元素的属性值

image-20210103103405417

image-20210103103439227

新的方法更改元素的属性值

image-20210103103839654

元素的自定义属性不能通过元素.属性获取，需要通过第二种方式进行获取

移除属性

image-20210103103916586

image-20210103170348564

image-20210103170419152

案列

表单的全选案列在js-第三章-3.4

tab栏切换案例（重点）

image-20210103111527431

image-20210103111201483

image-20210103165150923

H5自定义属性

image-20210103165652807

image-20210103165810407

image-20210103165932044

image-20210103170025500

操作节点

节点操作是为了获取元素

image-20210103173411695

image-20210103173607364

image-20210103173634545

image-20210104093828887

创建节点

image-20210104093506529

添加节点

image-20210104093658014

image-20210104093727277

父节点的操作

node.parentNode

得到的是离node元素最近的一个父亲节点

子节点的操作

image-20210103174153064

image-20210103174411245

image-20210103174534723

兄弟节点

image-20210104092935324

image-20210104093119246

image-20210104093159962

兄弟元素节点

image-20210104093338766

删除节点

node是父亲，删除的是父亲里面的孩子节点

image-20210103172600204

复制节点+添加节点

image-20210103172816767

image-20210103173123377

案列：留言创建

事件的高级操作

注册事件的两种方式

image-20210104105153436

事件监听方式

image-20210104105317887

image-20210104105541306

删除事件（解绑事件）

image-20210104152432156

image-20210104152457416

兼容性写法

image-20210104152557070

DOM事件流

image-20210104152856415

image-20210104153348527

事件对象

image-20210104153844224

事件对象的常见属性和方法

image-20210104153955411

image-20210104154233526

阻止默认行为

image-20210104154704763

阻止事件冒泡

image-20210104155001127

image-20210104155013914

事件委托（重点）

image-20210104155336985

image-20210104155501313

常用的鼠标事件

image-20210104155748067

image-20210104155815091

鼠标事件对象

image-20210104155933767

常见的键盘事件

image-20210104160818368

键盘事件对象

image-20210104160954414

获取焦点

image-20210104161405095

失去焦点： blur

posted @ 2021-01-17 20:22  啊方不方  阅读(77)  评论(0)  编辑  收藏  举报