| 一、今日内容： 什么是BOM :浏览器对象模型，是javascript有能力与浏览器对话。 BOM提供了访问浏览器各种功能部件的途径，浏览器窗口本身，浏览器历史 什么是DOM:文档对象模型，使程序和脚本能够动态的访问和更新文档的内容，结构，样式，并独立于平台和语言的接口 DOM提供了一套HTML和XML文档的标准对象，以及访问这些文档的标准接口（方法） API 就是给程序员提供的一种工具，以便可以更加轻松实现某种功能。 webAPI 是浏览器提供的一套浏览器功能和页面元素的API，一般都是方法和函数 每一个html标签都是一个元素节点，element 标签中的文字是文本节点（空格，回车也是文本节点），text 标签的属性是属性节点，Attribute 一切都是节点 获取标签对象的主要方式 获取html元素 h4-- document.getElementById（‘id’）;---节点 document.getElementsByClassName（‘className’）--类名获取---节点集合不是数组 document.getElementsByTagName（‘tagName’）；--标签获取--节点的集合 不是数组 document.getElementsByName（‘name’）；--NodeList--数组 h5-- document.getquerySelector('选择器')；符合要求的第一个元素 document.getquerySelectorAll（‘选择器’）；符合要求的所有元素 NodeList--数组 控制标签内容 值 文本内容 文本内容 innerText 后面值不解析标签； innerHTML 解析标签 textContent 不解析标签 表单标签的值 Value 控制style样式 dom.style.属性名=‘属性值’； 当属性名中‘-’，在决赛中需要使用小驼峰命名法 background-color====backgroundColor 添加到标签的style属性中 控制class dom.className='class名'； 事件四要素 事件源--谁来触发--标签 事件类型： 什么事件 鼠标事件 键盘事件 事件处理函数： 触发之后要进行的行为 事件对象：事件发生时相关信息都保存到事件对象中 添加事件 dom.addEventListener('事件名称'，事件处理函数)； dom.addEventListener('click',function(event){ //事件源 console.log(event.target); //事件类型 console.log(event.type); //点击的坐标 console.log(event.clientX); console.log(event.clientY); }) |
| 欢迎光临 菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/) | Powered by Discuz! X3.4 |