JS3

window对象 ==> 代表一个HTML文档

属性：
页面导航的5个属性
self
parent
top
opener
frames
方法：
弹出对话框.3个：alert confirm prompt
页面定时器 setInterval clearInterval setTimeout clearTimeout
窗口打开关闭 open close

History ==> 浏览器的历史纪录 ==> 前进，后退

属性：length
方法：
forward 前进
back 后退
go 前进/后退

Location ==> 浏览器地址栏 ==> 跳转，刷新
属性：
href => 改变当前页面位置
方法：
reload => 刷新

DOM ==> Document Object Model ==> 文档对象模型 ==> 让JS 和HTML，CSS结合，可以使用JS来控制他们.

原理：将页面中所有内容，都封装成了对象。

Dom 中的五类对象：
Document 文档
Element 元素
Attribute 属性
Text 文本
Commons 注释
以上五类对象抽取了一个父类：
Node
自身属性：
nodeType
nodeName
nodeValue
获得Element的方式（重点）：
从Document中获得Element
1.getElementById
2.getElementByTagName
3.getElementByClassName
4.getElementByName
从Element中获得Element:
1.getElementsByTagName
2.getElementByClassName

Dom中的事件
给Element对象添加一个Function类型的属性。那么这个Function的运行时机与属性的名称有关.例如:
属性名触发时机
onClick 单击
ondblclick 双击
onload 当加载完毕
onchange 当内容改变
onblur 当失去焦点
onfocus 当得到焦点
................
在事件中我们想要获得事件的详情，那么我们需要拿到Event对象
获得：
事件函数是由浏览器在对应时机调用的，浏览器在调用的时候，已经Event传给我们了，对于我们来讲，接受下就好
属性：
keyCode : 按键的编码
button：鼠标按键的编码
clientX/client：鼠标所在位置的x y轴坐标
方法：
preventDefault:阻止默认行为，例如：在点击submit按钮时，表单提交默认动作。
stopPropergation: 停止事件的继续传播。例如：在嵌套的DIV中，点击里面的div，同时也会触发外层div的onclick事件，如果不想触发外层使用

DOM中常用操作
增
创建元素： document,createElement
添加： element.appendChild => 添加到末尾
element.insertBefore => 指定添加位置
删
removeAttribute
removeChild
改
replaceChild 改元素
setAttribute 改属性
查
getAttribute 查属性值
getElementById
getElementByTagName
getElementByClassName
getElementByName

DHTML技术
由微软推出，Dynamic HTML 动态网页技术，整合了 HTML CSS JavaScript DOM 4个技术
可以理解为对DOM对象的增强；增加了一些新的属性和方法。让我们开发更加便捷。
例如：一个元素的class属性，我们想改变，我们使用setAttribute("class","类名")可以，但是DHTML提供了更方便的操作，className属性。

//表格排序
1.获得表格中所有的行
var table = document.getElmentsByTagName("table")[0];
var rows = table.rows;
2.创建一个新的数组，将需要排序的行装入
var arr = [];
for (var i = 1; i arr[i-1] = rows[i];
}
3.对新的数组排序
arr.sort(abc);
4.排序好的数组遍历插回表格中
for (var i = 0; i< arr.length ; i++){
table.appendChild(arr[i]);
}
隔行变色
//1.获得所有要变色的行
var rows = document.getElementsByTagName("table")[0].rows;
//2.遍历这些行
for (var i = 1; i < rows.length ; i++){
//对行号%2,对得到的结果判断
if(i%2){
//余1 == 给另一个颜色
rows[i].className = "one";
}
else{
//余0 ==> 给一个颜色
rows[i].className = "two";
}

//表单验证
//1. 获得要验证的用户名
//2. 定义正则表达式 ==> 首字符不能使用数字，长度在6到10之间
//3. 验证
//删除错误消息
//失败 ==> 提示，拦截提交(return false)
//1 创建一个font元素对象
//2 添加属性 color = "red"
//3 添加内容 innerHTML
// 4 添加到 input 后面

//1 找到错误消息
//2 移除
作业1 ：表单校验

//页面之间通信
//1 获得用户选择的option的内容
//2 获得要操作的input type = text ==> 获得document ==> 获得window
//3 将值赋值到input type = text
//4 当前页面关闭close

XML语法

文档声明

注意：1.空格使用英文空格
2.顶着1行1列书写
二.元素
注意：
1.元素分为自闭合和有开始结束标签两部分两种
2.可以合理嵌套不能交叉嵌套
3.元素中的内容不要为了美化，加空格，回车，制表符之类符号
4.元素名称区分大小写,

不是同一个标签
5.元素的命名：开始字符不能使数字. 元素名称中不能包含” “， ”：“.元素名称中不能出现关键字: xml

三. 属性
注意
1.必须是键值对.
2.值必须用单引号或双引号包裹.
3.属性必须出现在开始标签中.
4.
四.注释：
注释不能嵌套
五.CDATA => Characcter DATA
==> ==> ==> <>
六、处理指令

XML约束：
1.书写根元素（因为xsd文件的引入是在元素上进行的）
2.在根元素上书写schemaLocation属性，填入命名空间，和xsd文件位置（可以引入多个，每个之间用空格，回车隔开）
3.为引入的xsd定义一个前缀.xmlns="http://www.itcast.cn/xml"
4.固定值. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
与html相比的异同

功能

XML语法
如何书写格式良好的XML
XML约束
XML解析

//1. 获得鼠标的位置(client/Y)
//2. 设置id = two的div的位置为鼠标位置
// 1 > 设置id = two的div的position属性为absolute
2 > 设置id = two的div的top和left鼠标的对应坐标

function fun1(a){
//1. 获得a标签的父标签
//2. 设置div的display属性为none
a.parentNode.style.display="none";
}

JS3

你可能感兴趣的:(JS3)