HTML DOM的基本知识
来源:互联网 发布:pr2015破解for mac 编辑:程序博客网 时间:2024/04/28 01:35
HTML DOM 基本知识总结
1.HTML DOM 访问
- 通过使用 getElementById() 方法 语法:node.getElementById("id");
- 通过使用 getElementsByTagName() 方法 语法:node.getElementsByTagName("tagname");
- 通过使用 getElementsByClassName() 方法 语法:document.getElementsByClassName("className");
b.nodeName 属性获取元素内容的最简单方法是使用 innerHTML 属性。innerHTML 属性对于获取或替换 HTML 元素的内容很有用。
nodeName 属性规定节点的名称。nodeName 是只读的, 元素节点的 nodeName 与标签名相同, 属性节点的 nodeName 与属性名相同, 文本节点的 nodeName 始终是 #text, 文档节点的 nodeName 始终是 #document。
c.nodeValue 属性
nodeValue 属性规定节点的值。元素节点的 nodeValue 是 undefined 或 null,文本节点的 nodeValue 是文本本身,属性节点的 nodeValue 是属性值。
d.nodeType 属性
nodeType 属性返回节点的类型。nodeType 是只读的。
3.HTML DOM 方法
一些常用的 HTML DOM 方法:
- getElementById(id) - 获取带有指定 id 的节点(元素)
- appendChild(node) - 插入新的子节点(元素)
- removeChild(node) - 删除子节点(元素)
一些常用的 HTML DOM 属性:
- innerHTML - 节点(元素)的文本值
- parentNode - 节点(元素)的父节点
- childNodes - 节点(元素)的子节点
- attributes - 节点(元素)的属性节点
一些 DOM 对象方法
方法 描述 getElementById()返回带有指定 ID 的元素。getElementsByTagName()返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组)。getElementsByClassName()返回包含带有指定类名的所有元素的节点列表。appendChild()把新的子节点添加到指定节点。removeChild()删除子节点。replaceChild()替换子节点。insertBefore()在指定的子节点前面插入新的子节点。createAttribute()创建属性节点。createElement()创建元素节点。createTextNode()创建文本节点。getAttribute()返回指定的属性值。setAttribute()把指定属性设置或修改为指定的值。
4.HTML DOM 修改
document.getElementById("id").innerHTML="New text!";
document.getElementById("id").style.color="blue";
document.getElementById("id").style.fontFamily="Arial";
document.getElementById("id").style.fontSize="larger";
document.body.style.backgroundColor='black'
5.HTML DOM 导航
x=document.getElementsByTagName("tagName");
for (i=0;i<x.length;i++)
{
document.write(x[i].innerHTML);
document.write("<br />");
}
- HTML DOM的基本知识
- html编辑的基本知识
- HTML+CSS的基本知识
- 学习HTML的基本知识
- Html的基本知识
- HTML的基本知识
- JavaScript的一些基本知识 -- DOM操作
- HTML DOM的加载
- HTML的DOM编程
- html的dom
- Html的Dom排序
- HTML基本知识
- HTML基本知识
- HTML基本知识
- html基本知识
- HTML基本知识
- HTML DOM和XML DOM的区别
- 核心DOM和html DOM的区别
- BPMN扩展元素
- sql server 2008 镜像挂起
- 在Windows下搭建React Native Android开发环境
- 2.7-3 Android Studio 的Gradle一点理解, 查看gradle 版本和android 插件的版本
- android sdk的下载以及安装
- HTML DOM的基本知识
- eclipse 《---》android studuio
- vi 修正readonly file
- bzoj1997
- 冒泡排序
- as导入eclipse项目出现There are unrecoverable errors which must be corrected first
- 【算法】最短路——两点最短总权和
- 二分查找算法-java
- (转载) 《火星救援》中你应该知道的5个高可用系统故障恢复原则