Jquery的DOM

**********************创建节点**************************

var $div5 = $('<div id="div5">我是div5</div>');

需求: 在div2后面插入div5

**********************插入节点**************************

一.同级节点

1. after

插入到后面

2. insertAfter

和after 相反前后调换顺序即可

3. before

插入到前面

4. insertBefore

和before 相反前后调换顺序即可

二.插入子集节点

1. append

在子集节点后面追加

需求: 在div4 里面插入 <b>你好</b>

2. appendTo

也是追加到子节点后面和append 前面调换顺序

3. prepend()

4. prependTo()

**********************二.删除节点和清空节点**************************

一. 删除节点

需求: 删除div1

jQuery对象.remove();

二.清空节点

jQuery对象.empty();//清空子元素

**********************三.替换节点**************************

需求: div3 替换成文本框

1. replaceWith()

2. replaceAll()

正好和replaceWith 相反 , 前后调换顺序即可

**********************四.节点移动**************************

把现有的节点插入到另一个现有节点的前后相当于移动

**********************五.节点克隆**************************

jQuery对象.clone();//默认值是 false 只克隆对象不包含事件 true 也带事件

**********************六.包裹节点**************************

1. wrap();

2. wrapAll();

3. wrapInner();

转载于:https://www.cnblogs.com/MrTanJunCai/p/9907759.html

Jquery的DOM相关推荐

jQuery添加DOM节点常用的5种方法
一.内部插入(前插入.后插入): <!DOCTYPE html> <html><head><meta charset="UTF-8"> ...
JQuery：DOM操作
文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构. DO ...
原生JS和jQuery操作DOM的区别小结
一.Js原生对象和jQuery实例对象的相互转化: (1).原生JS对象转JQ对象: $(DOM对象); (2). JQ对象转原生JS对象: $(DOM对象).get(index); //注意区分eq ...
jQuery操作Dom、jQuery事件机制、jQuery补充部分
jQuery操作Dom: 修改属性: //使用attr()方法 //attr(name, value) //name:要修改的属性的属性名 //value:对应的值 //attr方法,如果当前标签有要 ...
03-老马jQuery教程-DOM操作(上）
jQuery DOM操作在没有jQuery之前,DOM的操作相对来说有点麻烦,尤其是DOM节点的搜索.目前我们已经学习了jQuery的选择器,接下带大家一块学习jQuery的DOM操作,jQuery ...
jQuery 操作DOM总结,DOM Core操作,HTML-DOM操作和CSS-DOM操作
jQuery创建元素节点或文本节点或属性节点.jQuery插入节点.jQuery删除节点.jQuery复制节点.jQuery替换节点.jQuery包裹节点.jQuery属性操作.jQuery样式操作. ...
04-老马jQuery教程-DOM节点操作及位置和大小
1. jQuery创建DOM标签 1.1 DOM动态创建标签的方法 DOM时代我们通过document的createElement方法动态创建标签.创建标签后,动态的给他添加属性.例如代码: // 动 ...
关于jquery与dom元素转换
其实一开始我也分不清到底哪些是jquery对象,哪些是dom对象,永久了jquery对dom就更是不熟了,我举个例子说一下 jquery对象是用$()包装过的对象,所以有时候用jquery对象和dom ...
jQuery中DOM操作方法之 html,text,val
jQuery内核 DOM操作方法之 html,text,val 回顾下几组DOM插入有关的方法 innerHTML 设置或获取位于对象起始和结束标签内的 HTML outerHTML 设置或获取对 ...
javascrpt --- 使用jquery添加dom元素和Angular ng-repeat生成select性能比较
今天用两种方法实现了动态的给select添加option的功能. 第一种是用jquery. // html <select id="drag-pointList">&l ...

Jquery的DOM

Jquery的DOM相关推荐

最新文章

热门文章