学习总结--Dom
节点(每个元素都会有的3个nodeValue nodeType nodeName;)
1 元素节点 nodeName 元素节点名 nodeType 1 nodeValue null或者undefined
2属性节点 nodeName 属性节点名 nodeType 2 nodeValue 属性节点的值
3 文本节点 nodeName #text nodeType 3 nodeValue 文本值
2 创建元素节点 document.createElement('li')
3创建文本节点document.createTextNode("123");
4 属性节点 通过元素节点.属性名去创建或者 node.setAttribute(name,value);获取节点的属性值 node.getAttribute(name);移除节点的属性值 node.removeAttribute(name);
5追加节点 node.appendChild(newchild);
6 删除节点 node.parentNode.removeChild(node);
7 克隆节点 node.cloneNode(true);
8 替换节点node.replaceChild(nwchild, oldchild); 除了具有替换节点的功能,还具有移动节点的功能;可以自定义函数replaceEach(achild,bchild) 两个节点彼此替换位置;
9父节点 paraentNode 子节点 firstElementChild firstChild lastElementChild lastChild 下一兄弟节点nextSibling nextElementSibling 前一兄弟节点previousSibling previousElementSibling;
10节点的获取
document.getElementById('');
document.getElementsByTagName('');
document.getElementsByClassName('')
document.getElementsByName('');
学习总结--Dom的更多相关文章
- html学习笔记-DOM
html学习笔记-DOM Table of Contents 1. 什么是 DOM? 2. DOM 节点 3. DOM 方法 4. DOM 属性 5. DOM 访问 6. DOM 修改 7. DOM ...
- 学习总结——DOM
DOM(Document Object Model),即文档对象模型.DOM是针对HTML和XML文档的一个API,它描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.在定义方面, ...
- 原生js学习 选择dom
连bootstrap5 都抛弃jquery了,重新使用原生js来写,所以最近在学习原生js. 一.选择dom元素: id let sure=document.getElementById('sure' ...
- js学习笔记--dom部分(一)
js 学习整理之Dom部分 前面我总结了我最近学习js基础部分,当时提到过js分了三大部分,第一部分ECMA基础也就是第一次写的基础部分, 第二部分也就是DOM部分,也就是这里要写的内容的,然后第三部 ...
- javascript基础学习系列-DOM盒子模型常用属性
最近在学习DOM盒子模型,各种属性看着眼花缭乱,下面根据三个系列来分别介绍一下: client系列 clientWidth :width+(padding-left)+(padding-right)— ...
- javascript基础学习--HTML DOM
写在前面的话:由于学校没有开过javascript这门课,所以平时用javascript时都是用到什么就去搜什么样的代码,但是在工作中有时候搜来的代码总是有那么点小问题,而当自己想去修改时,却又无从下 ...
- Vue.js_础学习之DOM操作
demo说明: 1.{{message}} --“Mustache” 语法(双大括号) 2.v-bind:属性名 ...
- 轻松学习JavaScript十八:DOM编程学习之DOM简单介绍
一DOM概述 DOM(文档对象模型)是HTML和XML的应用程序接口(API).DOM将把整个页面规划成由节点层级构成的文档. DOM描绘了一个层次化的节点树,执行开发者加入,移除和改动页面的某一部分 ...
- 学习WEBAPI(DOM)第二天
目录 第二天学习目标: 一.阻止超链接的默认跳转行为 二.鼠标进入事件和鼠标离开事件 三.根据name属性值获取元素==>表单标签,返回的是伪数组 四.根据类样式的名字来获取元素,返回的是伪数组 ...
- Javascript学习,DOM对象,方法的使用
JavaScript: ECMAScript: BOM: DOM: 事件 DOM的简单学习 功能:控制html文档内容 代码:获取页面标签(元素)对象和Element document.getElem ...
随机推荐
- 怎么给Unity写一个原生的插件
本文章由cartzhang编写,转载请注明出处. 所有权利保留. 文章链接:http://blog.csdn.net/cartzhang/article/details/50266889 作者:car ...
- 【转】C#添加修改删除文件文件夹大全
[转]C#添加修改删除文件文件夹大全 C#添加修改删除文件文件夹大全 StreamWriter sw = File.AppendText(Server.MapPath(".")+& ...
- Android ADB工具-截图和录制视频(五)
Android ADB工具-截图和录制视频(五) 标签(空格分隔): Android ADB 7. 截图和录制视 命令 功能 adb shell screencap –p <path/file& ...
- leetcode笔记:Merge Sorted Array
一.题目描写叙述 二.解题技巧 这道题不存在复杂的分析过程和边界条件.假设单纯得考虑从小到大地将两个数组进行合并的话.每次在num1中插入一个数的话,须要将后面的元素都向后移动一位.这样.整个处理过程 ...
- RabbitMQ inequivalent arg 'durable' for exchange 'csExchange' in vhost '/': received
错误:inequivalent arg 'durable' for exchange 'csExchange' in vhost '/': received 使用不同的MQ客户端时,常常会出现以上错误 ...
- 计算机系统之汇编---IA32处理器数据格式及数据操作
计算机系统之汇编---IA32处理器数据格式及数据操作 IA32数据格式: Intel用术语"字"表示16位数据类型,因此.称32位数为"双字",称64位数为& ...
- _00020 妳那伊抹微笑_谁的异常最诡异第一期之 SqlServer RSA premaster secret error
博文作者:妳那伊抹微笑 博客地址:http://blog.csdn.net/u012185296 博文标题:_00020 妳那伊抹微笑_谁的异常最诡异第一期之 SqlServer RSA premas ...
- HP-lefthand底层结构具体解释及存储灾难数据恢复
HP-lefthand底层结构具体解释及存储灾难数据恢复 一.HP-lefthand的特点 HP-lefhand是一款很不错的SAN存储,使用iscsi协议为client分配空间. 它支持RAID5. ...
- nj09---util、inherits、inspect、events、error
一.util全局变量 1.util.inherits(constructor,superConstructor) 此方法是一个实现对象间原型继承的函数.javaScript通过原型赋值来实现继承,细节 ...
- Numpy科学计算工具
Numpy初探 Numpy基础数据结构 Numpy数组是一个多维数组,称为ndarray.其由两部分组成: 实际的数据 描述这些数据的原数据 导入该库: import numpy as np 多维数组 ...