今日所学内容 一、设计模式介绍 1.什么是设计模式 设计模式就是程序员针对特定问题,给出的简洁而优化的处理方案。所以设计模式,只在特定的情况,特定的实际,针对特定的问题使用。 2.常用的设计模式: 1) 单例模式:只允许存在一个实例的模式 2) 组合模式:把若干个启动方式一样的构造函数放在一起,准备一个总开关,总开关一启动,那么这些构造函数就都启动了 3) 观察者模式:又称发布订阅者模式,经典案例:事件监听 4) 代理模式:proxy,为其他对象提供一种代理以控制对这个对象的访问,为了不暴露执行对象的部分代码 5) 工厂模式:工厂函数就是做一个对象创建的封装,并将创建的对象return出去 6) 策略模式:定义一系列的算法,把他们一个个的封装起来,并且使他们可以相互替换,从而避免很多if语句 二、DOM和BOM概述 1.DOM和BOM DOM文档对象模型:是一个使程序和脚本能够动态的访问和更新文档的内容、结构以及样式,并独立于平台和语言的接口 BOM浏览器对象模型:使javascript有能力与浏览器进行对话 API:应用程序编程接口,就是给程序员提供的一种工具,以便可以更加轻松实现某种功能 web API:是浏览器提供的一套浏览器功能和页面元素的API 2.DOM,DOM树结构分析 核心DOM:用于XML与HTML的共用接口(操作节点树,创建,删除,查找等) XML DOM:XML专用接口,其实就是DOM进行增强,加入一些适用于自己的接口 HTML DOM:HTML专用接口,其实就是DOM进行增强,加入了一些适用于自己的接口H DOM树:HTML节点树 HTML文档是一种树状的结构化文档,各标记之间是一种树状的层次关系 节点:整个文档就是文档节点--document 每一个HTML标签都是一个元素节点---element 标签中的文字是文本节点(回车,空格也是文本节点)---text 标签的属性就是属性节点---Attribute 所有的一切都是节点----Node 3.获取标签对象的主要方式 1) 获取HTML元素--H4 getElementById() 在文档中查找指定的id节点,如果找到则返回该节点 getElementsByTagName() 在文档中查找指定的标签名的对象的集合 getElementsByClassName() class---类名--集合 getElementsByName() name属性---集合 2) H5--选择器 单个--符合要求的第一个节点 document.querySelector(选择器) 集合--符合要求的所有节点 document.querySelectorAll(选择器) 4.操作标签的内容 1) 文本标签的内容 innerHTML innerText textContent 2) 表单标签 value 5.操作标签的样式 获取样式属性的值 dom.style.样式的属性名 设置 dom.style.样式的属性名="样式的属性值" 6.操作标签的类名 获取类名 dom.className 设置类名 dom.className="类名的值"
|