`

jquery Manipulation

阅读更多
http://docs.jquery.com/Manipulation
看过之后,发现Manipulation主要是说的是如何运用jquery方便的对dom中的元素做插入、替换、删除、copy等操作。 这些也算是dom操作中常常会用上的,比较实用。

insert
分insertinside、insertoutside、insertAround(wrap),
感觉这里的insert应该理解成位移插入比较合适,有点像cut&paste。
为了便于理解insertinside和insertoutside,举个例子, <p>a </p> b 在a位置上插入就是insertinside,而b位置就是insertoutside

insertinside包括
append
appendTo
prepend
prependTo
谈谈区别,append是追加到后面, 而prepend是往前面追加的;
appendTo和prependTo只是转换了一个主动和被动关系
$("a").appendTo($('b')), a被追加到了b的后面,其实就等价于$("b").append($('a'))

而insertoutside包括
after
insertAfter
before
insertBefore
跟上面的很类似,$("a").insertAfter($('b')),可以理解成$("b").after($('a'))

Inserting Around感觉有些像是装潢, 而wrap的字义更是包含装潢的意思。
wrap
$("p").wrap("<div></div>");
就是将每个符合规则的p, 装潢到div中
wrapAll
对于上面这个例子,wrapAll是将所有的p都装潢到div中
wrapInner
对于上面例子, 是将p的child对象装潢到div中

replacing
replaceWith( content ) Returns: jQuery
用于将满足规则的对象替换成指定的content, 例如:
$("p").replaceWith("<b>"+$(p).text()+"</b>");
replaceAll( selector ) Returns: jQuery
将selector替换成满足规则的对象,例如
$("<b>Paragraph. </b>").replaceAll("p"); p被替换成了b

Removing
empty( ) Returns: jQuery
从符合规则的对象中删除它们的子对象
remove( expr ) Returns: jQuery
删除所有符合规则的对象

Copying:
clone( ) Returns: jQuery
复制符合规则的对象,并且返回clone的
clone( true ) Returns: jQuery
跟上面的方法类似,是一个重载方法, true表示也一同复制对象的event handlers

分享到:
评论

相关推荐

    jquery Manipulation元素操作

    《jQuery元素操作详解》 在Web开发中,jQuery库以其简洁、高效的API赢得了广大开发者喜爱,其中元素操作是jQuery的核心功能之一。这篇博客将深入探讨jQuery如何进行元素选择、操作和增强DOM(文档对象模型)的功能...

    jquery-1.11.3.js 、jquery-1.11.3.min.js 【官方jquery包 js】

    2. **DOM操作(DOM Manipulation)** jQuery提供了丰富的DOM操作方法,如`append()`、`prepend()`用于元素的插入,`html()`、`text()`用于元素内容的设置,`remove()`、`detach()`用于元素的移除。这些方法使得DOM...

    jqueryApi版本集合

    3. **DOM操作(DOM Manipulation)**:jQuery提供了丰富的API来操作DOM,如.append()用于在元素内部追加内容,.remove()用于移除元素。 4. **事件处理(Event Handling)**:jQuery简化了事件绑定,例如,.click...

    jquery资料--jquery学习资料

    3. **DOM操作(DOM Manipulation)**:jQuery提供了丰富的DOM操作方法,包括添加、删除和修改元素,如`$("div").append("&lt;p&gt;Hello&lt;/p&gt;")`在每个div后添加一个段落。 4. **事件处理(Events)**:jQuery统一了事件...

    jquery api, jquery ui api, jquery源码分析

    2. **DOM 操作(DOM Manipulation)**:jQuery 提供了一系列方法用于创建、修改和操作DOM元素,如 `append()` 在元素末尾添加内容,`prepend()` 在元素开头添加内容,`html()` 和 `text()` 用于设置或获取元素的HTML...

    jQuery基础自学笔记(pink老师jQuery全内容)

    3. **DOM 操作(DOM Manipulation)** - `$(selector).html()` 用于获取或设置元素的HTML内容。 - `$(selector).text()` 用于获取或设置元素的文本内容。 - `$(selector).append()` 和 `.prepend()` 分别用于在...

    jQuery.Essentials.

    We start off with a quick glance through the basics of JQuery, followed by the explanation of JQuery selectors, filters, and DOM element manipulation. After this, you will learn how events and ...

    jQuery技术内幕 深入解析jQuery架构设计与实现原理

    最后详细分析了功能模块的源码实现,包括:属性操作attributes、事件系统events、dom遍历traversing、dom操作manipulation、样式操作css、异步请求ajax、动画effects。  《jquery技术内幕:深入解析jquery架构设计...

    jQuery 3.1 参考手册中文.zip

    2. **DOM操作(DOM Manipulation)**:jQuery 提供了方便的方法来添加、删除或修改DOM元素。例如,`append()`用于在元素内部追加内容,`remove()`用于删除元素,`html()`和`text()`则用于获取或设置元素的HTML内容和...

    jQuery中文API

    2. **DOM操作(DOM Manipulation)**:jQuery提供了简便的方法来创建、删除、修改DOM元素。例如,`$(html)`可以创建新的HTML结构,`.append()`和`.prepend()`用于在元素内部添加内容,`.remove()`则用于删除元素。 ...

    jquery参考手册jquery帮助文档

    DOM操作(DOM Manipulation)** jQuery 提供了一系列方法来操作DOM元素,如`append()`用于在元素内部追加内容,`html()`用于获取或设置元素的HTML内容,`remove()`用于删除元素。 **3. 事件处理(Event Handling)...

    jquery api 3.2.1

    2. **DOM操作(DOM Manipulation)**:jQuery提供了丰富的DOM操作方法。例如,`append()`用于在元素内部添加内容,`prepend()`则在元素内部头部插入内容;`html()`可以获取或设置元素的HTML内容,`text()`则处理文本...

    jquery API 和 jquery ui API

    2. **DOM操作(DOM Manipulation)**:jQuery 提供了便捷的方法来创建、修改和删除DOM元素。例如,`append()` 和 `prepend()` 用于在元素内部添加内容,`html()` 和 `text()` 用于获取或设置元素的HTML或文本内容,`...

    Beginning.jQuery

    Use jQuery’s powerful manipulation tools to dynamically update your website’s content Animate content and build your own image slider with jQuery’s animation tools Extend the library by writing ...

    jquery api 3.3.1中文文档

    2. **DOM操作(DOM Manipulation)**:包括`$(selector).html()`, `$(selector).append()`等方法,用于修改元素内容、添加子元素或者删除元素。 3. **事件处理(Events)**:通过`$(selector).on('event', function...

    jqueryAPI jquery使用文档

    二、DOM操作(DOM Manipulation) jQuery 提供了一系列方法用于操作DOM元素: - `.html()`:获取或设置元素的HTML内容。 - `.text()`:获取或设置元素的文本内容。 - `.append()`:在元素内部追加内容。 - `....

    jquery chm 离线文档 附代码

    2. **DOM操作(DOM Manipulation)**:jQuery提供了一系列方法来创建、修改和删除DOM元素,如`$(selector).append()`用于在元素内部添加内容,`$(selector).remove()`用于删除元素。 3. **事件处理(Event Handling...

    jquery API 使用手册

    2. **DOM操作(DOM Manipulation)**:jQuery提供了方便的DOM操作方法,包括添加、删除和修改元素。例如,`append()`用于向元素内部追加内容,`remove()`移除元素,`html()`可以设置或获取元素的HTML内容。 3. **...

    JQuery1.4.1类库,JQuery1.4.2类库和帮助文档

    4. **API详解**:jQuery的API包括选择器(Selectors)、属性操作(Attributes)、DOM操作(Manipulation)、CSS操作(CSS)、事件处理(Events)、动画(Effects)和Ajax交互(Ajax)等多个方面。例如,`$(selector)...

    JQuery In Action.PDF

    This chapter is crucial for mastering the art of DOM manipulation with JQuery. ### Conclusion **"JQuery in Action"** is a valuable resource for both beginners and experienced developers looking to ...

Global site tag (gtag.js) - Google Analytics