* 课程回顾:
* js语法
* js的动态函数和匿名函数
* js动态函数 Function new Function();
* 匿名函数:没有名称的函数,起个名称
var add = function(){

};

* js中全局变量和局部变量
* 全部变量:定义<script>标签中的变量,在页面的任意位置上都能拿到。
* 局部变量:定义在方法内部的变量

* js的对象和API
* String对象
* 属性:length长度
* 方法:
* 和HTML相关方法
* bold() 粗体
* fontcolor() 字体颜色
* sup() 上标
* sub() 下标

* 和java中String类似的方法
* charAt() 返回指定位置的字符
* indexof() 返回字符的位置
* substring(start,stop) 截取字符串
* substr(start,length) 截取字符串

* Array数组
* 声明数组
* var arr = [22];
* var arr = new Array(4或者"abc");

* 方法:
* concat() 链接数组或者元素
* pop() 删除最后一个元素,返回
* push() 向末尾添加一个元素,返回长度。
* sort() 排序

* Date对象
* var date = new Date(); 当前时间
* 方法:
* toLocaleString() 显示当地日期格式
* getFullYear() 获取年份
* getMonth() 获取月份(0-11) +1
* getDate() 几号
* getDay() 星期几

* getTime() 毫秒值
* setTime() 根据毫秒值设置时间
* Date.parse(); 可以字符串,返回是毫秒值

* Math数学
* ceil() 上舍入
* floor() 下舍入
* round() 四舍五入
* random() 随机数

* RegExp对象
* new RegExp("")
* var reg = /^表达式$/;(记住)

* reg.test(string);(记住) 如果匹配返回true,如果匹配不成功返回false。

* 全局函数
* eval() 解析字符串,执行js的代码。
* isNaN() 判断是否是非数字值
* parseInt()

* BOM 浏览器对象模型
* winodw 窗口对象
* alert() 提示框
* confirm() 询问框
* setInterval("run()",3000) 每隔3秒执行run方法,返回唯一的id值
* setTimeout("run()",3000); 3秒后执行run方法,返回唯一的id值

* 清除定时器
* clearInterval(id)
* clearTimeout(id)

* open("","","") 弹出新的窗口
* close() 关闭窗口

* navigator 和浏览器版本相关
* 属性
* history 和历史相关
* back() 上一页
* forward() 下一页
* go(1或者-1)
* location 和地址相关
* href="" 获取和设置链接

===============================================================================================================================

* DOM 文档对象模型
* Document Object Model
* 文档:标记型文档 (HTML/XML)
* 对象:封装属性和行为(方法)
* 模型:共性特征的体现

* DOM解析HTML
* 通过DOM的方法,把HTML全部(元素(标签)、文本、属性)都封装成了对象。
<span id="spanId">文本</span>

* DOM想要操作标记型文档先解析。(解析器)
* DOM解析HTML(浏览器就可以HTML)

* 浏览器DOM解析HTML?

* DOM的三个级别:

* DHTML不是一种编程语言。
* html :封装数据。 <span>展示给用户的数据</span>
* css :设置样式(显示效果)
* dom :操作HTML(解析HTML)
* js :提供逻辑(判断语句,循环语句)

* Document:代表整个文档。
* 方法:
getElementById("id的值"); 通过元素的id的属性获取元素(标签)对象。
getElementsByName("name属性值"); 通过名称获取元素对象的集合(返回数组)
getElementsByTagName("标签名称"); 通过标签名称获取元素对象的集合(返回数组)

* write("文本的内容(html的标签)") 把文本内容写到浏览器上。

* createElement("元素名称"); 创建元素对象
* createTextNode("文本内容") 创建文本对象

* appendChild("子节点") 添加子节点

<span id=""></span>

* Element对象
* 获取元素对象
* getAttribute("属性名称"); 获取属性的值
* setAttribute("属性名称","属性的值"); 设置或者修改属性的值
* removeAttribute("属性名称"); 删除属性

* 获取元素下的所有子节点(*****)
* ul.getElementsByTagName();

* Node:节点对象
* nodeName :节点名称
* nodeType :节点类型
* nodeValue :节点的值

* parentNode 获取父节点(永远是一个元素节点)

IE6-8 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? IE9-11 Chrome FireFox
firstChild 第一个节点 ? ? ? ? ? ? ? ? firstElementChild?第一个节点
lastChild最后一个节点、 ? ? ? ? ? ? ? lastElementChild 最后一个节点
nextSibling 下一同级节点 ? ? ? ? ? ? ?nextElementSibling?下一同级节点
previousSibling 上一同级节点 ? ? ? ? ?previousElementSibling?上一同级节点

<ul>
<li>北京</li>
</ul>

* 如果通过ul获取北京的子节点,使用是 ul.firstElementChild; 获取北京的子节点(IE9-11 Chrome FireFox)
* 但是如果IE6-8,需要使用firstChild;

<span id="spanId">
文本内容
</span>

* 使用span的标签获取span中间的文本内容(也是对象),需要使用firstChild;(不管是什么浏览器)

* 方法
* hasChildNodes() 检查是否包含子节点
* hasAttributes() 检查是否包含属性

* appendChild(node) 父节点调用,在末尾添加子节点
* insertBefore(new,old) 父节点调用,在指定节点之前添加子节点
* replaceChild(new,old) 父节点调用,替换节点
* removeChild(node) 父节点调用,删除节点

* cloneNode(boolean) 不是父节点调用,复制节点
* boolean :如果是true,复制子节点
:如果是false,不复制子节点,默认是false

* innerHTML :获取和设置文本内容。
* innerHTML属性:
* 获取文本内容
* 设置文本内容

* 事件:
onclick 点击事件
onload 加载事件
onfocus 获取焦点事件
onblur 失去焦点事件

* 全选/全不选/反选的练习
<input type="checkbox" />
* 指定默认值:checked 只要出现在<input type="checkbox" />,对号就勾上了。

* 鼠标移动的事件
onmousemove
onmouseout
onmouseover

* 鼠标点击事件(*****)
onclick 单击
ondblclick 双击

* 加载和卸载
* onload(*****) 加载
* onunload 卸载

* 获取焦点和失去焦点(*****)
* onfocus 获取焦点
* onblur 失去焦点

* 键盘
* onkeyup 按下抬起

* 改变事件(*****)
* onchange

* 控制表单的提交(*****)
onsubmit

* 作业:
* insertBefore(new,old) 在指定节点之前添加子节点
* 在上海之前添加子节点

传智168期JavaEE就业班 day04-dom的更多相关文章

  1. 传智168期JavaEE就业班 day03-js

    * 课程回顾: * CSS * CSS的简介 * 层叠样式表. * CSS与HTML的结合(4种) * HTML的标签提供了属性 style="CSS的代码" * HTML提供了标 ...

  2. 传智168期JavaEE就业班 day02-css

    * 课程回顾: * HTML语言 * HTML的简介 超文本标记语言. * 是网页最基础的语言. * 都是由标签所组成的. * HTML的基本格式 <html> <head> ...

  3. 传智168期JavaEE就业班 day05-XML 约束与解析

    * 课程回顾: * DOM解析HTML简介 * DOM 文档对象模型 * 解析器 * document对象 * getElementById("id的值"); 返回一个元素(标签) ...

  4. 传智168期JavaEE就业班 day01-html

    * HTML * HTML: HyperText Markup Language 超文本标记语言. * HTML是最基础的网页语言. * HTML的代码都是由标签所组成. * HTML的基本格式 &l ...

  5. 成都传智播客java就业班(14.04.01班)就业快报(Java程序猿薪资一目了然)

    这是成都传智播客Java就业班的就业情况,很多其它详情请见成都传智播客官网:http://cd.itcast.cn?140812ls 姓名 入职公司 入职薪资(¥) 方同学 安**软件成都有限公司(J ...

  6. 成都传智播客java就业班和基础班

    传智播客成都Java培训,带你走进Java的世界... 我们有咨询的教育团队,一流的名师指导: 我们是重视基础理论建设,强化高端应用技能: 我们有四大JavaEE项目,海量Android项目: 我们是 ...

  7. 成都传智播客java就业班激情洋溢的青春篮球赛

    为了缓解学员们的学习压力,也为了培养学员们的团队协作精神,5月28日下午,在班主任倪老师和王老师联手带领下,我们1406280ls" style="color:rgb(51,102 ...

  8. 黑马传智JavaEE57期 2019最新基础+就业+在职加薪_汇总

    黑马传智JavaEE57期 2019最新基础+就业+在职加薪 阶段1 语言基础+高级· 1-1-Java基础语法 第14节 数组 111

  9. 2015年传智播客JavaEE 第168期就业班视频教程day45-ERP项目-01 10-类图结构分析设计

    运行astah-pro.bat,这是windows下运行的.astah-run.sh是Linux下运行的. 类结构视图的作用是描述类模型和模型与模型之间的关系,也就是说我们在这要把这个一对多和多对多的 ...

随机推荐

  1. MFC双缓冲绘图实例

    本人之前一直了解双缓冲绘图的基本原理,但是在研究很久之后才大概知道具体的使用过程,本文将详细介绍本人在实际项目中使用双缓冲绘图的案例. 实现功能:主界面显示某张包含人脸的图片,通过dlib detec ...

  2. testng环境设置

    1.在eclipse中安装testng插件,地址:http://beust.com/eclipse 2.设置testng环境变量 testng_home D:\Program Files\eclips ...

  3. 合工大OJ 1330 种树

    Description 某校大门外长度为L的马路上有一排树,每两棵相邻的树之间的间隔都是1米.我们可以把马路看成一个数轴,马路的一端在数轴0的位置,另一端在L的位置:数轴上的每个整数点,即0,1,2, ...

  4. notepad++下的字体设置

    设置 - 语言格式设置 中

  5. UVA 12723 Dudu, the Possum --数学期望

    题意不说了,概率和期望值要分开处理. 方法1:可以先算出到达每层的概率,然后再乘以每层的期望,每层的期望是固定的. 方法二:也可以从后往前直接推期望.为什么从后往前呢?因为第i层的时候,它可以跳到的层 ...

  6. MySQL数据库学习笔记(五)----MySQL字符串函数、日期时间函数

    一.常见字符串函数: 1.CHAR_LENGTH  获取长度(字符为单位) 2.FORMAT  格式化 3.INSERT  替换的方式插入 4.INSTR  获取位置 5.LEFT/RIGHT  取左 ...

  7. 【Java基础】java 获得本日,本周,本月的时间戳区间

    如果涉及到统计的话,可能会经常用到.很简单的基础知识. 1.getTimestampByOffsetDay public static long getTimestampByOffsetDay(int ...

  8. Java常用类库——Runtime

    runtime运行时候,是封装了一个JVM进程的类,每一个JAVA程序实际上启动了一个JVM进程,那么每个JVM对应一个runtime实例.此实例是由JVM为其实例化. 本类的定义中没有构造方法,因为 ...

  9. Redis集群环境的部署记录

    Redis Cluster终于出了Stable,这让人很是激动,等Stable很久了,所以还是先玩玩. 一. 集群简单概念. Redis 集群是一个可以在多个 Redis 节点之间进行数据共享的设施( ...

  10. nginx log的json格式:

    nginx log的json格式: 为了elk便于统计: yum安装nginx: log_format json '{"@timestamp": "$time_iso86 ...