1.1.1.1 JS中的DOM对象:
【DOM的概述】
Ø 什么是DOM
DOM:Document Object Model:文档对象模型.
将一个HTML的文档加载到内存形成一个树形结构,从而操作树形结构就可以改变HTML的样子.
Ø DOM的使用:
知道document,element,attribute中的属性和方法
【DOM的常用的操作】
Ø 获得元素:
* document.getElementById(); -- 通过ID获得元素.
* document.getElementsByName(); -- 通过name属性获得元素.
* document.getElementsByTagName(); -- 通过标签名获得元素.
Ø 创建元素:
* document.createElement(); -- 创建元素
* document.createTextNode(); -- 创建文本
var divElement = document.createElement(“div”);
Ø 添加节点:
* element.appendChild(); -- 在最后添加一个节点. document.getElementsByTagName(“h1”)[0]. appendChild(divElement)
* element.insertBefore(); -- 在某个元素之前插入.
Ø 删除节点:
* element.removeChild(); -- 删除元素
element.setAttribute()
【使用DOM完成对ul中添加一个li元素】
function addElement(){
var city = document.getElementById("city");
// 创建一个元素:
var liEl = document.createElement("li");
// 创建一个文本节点:
var text = document.createTextNode("深圳");
// 添加子节点:
liEl.appendChild(text);
city.appendChild(liEl);
}
JavaScript:
* JavaScript:基本使用:
* ECMAScript:
* 变量:弱变量类型: var i;
* 数据类型:原始类型和引用类型.
* 语句
* 运算符
* 对象:
* String,Boolean,Date,Math,Number,正则...
* 全局函数:eval(),encodeURI(),encodeURIComponent(),decodeURI(),decodeURIComponent(),parseInt(),parseFloat()
* BOM:浏览器对象.
* window:
* Navigator:
* Screen:
* History:
* Location:
* DOM:文档对象.
* 获得元素:
* document.getElementById(),document.getElementsByName(),document.getElementsByTagName();
* 添加元素:
* element.appendChild(),element,insertBefore();
* 删除元素:
* element.removeChild();
* 创建元素:
* document.createElement(),document.createTextNode();
* 修改元素值:
* innerHTML属性:
【DOM的概述】
Ø 什么是DOM
DOM:Document Object Model:文档对象模型.
将一个HTML的文档加载到内存形成一个树形结构,从而操作树形结构就可以改变HTML的样子.
Ø DOM的使用:
知道document,element,attribute中的属性和方法
【DOM的常用的操作】
Ø 获得元素:
* document.getElementById(); -- 通过ID获得元素.
* document.getElementsByName(); -- 通过name属性获得元素.
* document.getElementsByTagName(); -- 通过标签名获得元素.
Ø 创建元素:
* document.createElement(); -- 创建元素
* document.createTextNode(); -- 创建文本
var divElement = document.createElement(“div”);
Ø 添加节点:
* element.appendChild(); -- 在最后添加一个节点. document.getElementsByTagName(“h1”)[0]. appendChild(divElement)
* element.insertBefore(); -- 在某个元素之前插入.
Ø 删除节点:
* element.removeChild(); -- 删除元素
element.setAttribute()
【使用DOM完成对ul中添加一个li元素】
function addElement(){
var city = document.getElementById("city");
// 创建一个元素:
var liEl = document.createElement("li");
// 创建一个文本节点:
var text = document.createTextNode("深圳");
// 添加子节点:
liEl.appendChild(text);
city.appendChild(liEl);
}
JavaScript:
* JavaScript:基本使用:
* ECMAScript:
* 变量:弱变量类型: var i;
* 数据类型:原始类型和引用类型.
* 语句
* 运算符
* 对象:
* String,Boolean,Date,Math,Number,正则...
* 全局函数:eval(),encodeURI(),encodeURIComponent(),decodeURI(),decodeURIComponent(),parseInt(),parseFloat()
* BOM:浏览器对象.
* window:
* Navigator:
* Screen:
* History:
* Location:
* DOM:文档对象.
* 获得元素:
* document.getElementById(),document.getElementsByName(),document.getElementsByTagName();
* 添加元素:
* element.appendChild(),element,insertBefore();
* 删除元素:
* element.removeChild();
* 创建元素:
* document.createElement(),document.createTextNode();
* 修改元素值:
* innerHTML属性: