`

jQuery操作DOM

阅读更多
jQuery操作DOM
1.设置元素的属性
attr({key0:value0,key1:value1}) 设置多个属性
attr(key, function(index)) 通过该函数返回的值作为元素的属性值
html()仅支持xhtml的文档,不支持xml文章。text()则都支持。
val().join(“,”)获取select 标记中的多个选项值
val(array) 例如$(“:radio”).val([“radio2”,”radio3”]) ID号为radio2和3的单选框被选中

2.元素样式操作
AddClass(class0 class1 …)增加css
toggleClass(class) 动态CSS切换功能.当元素中含有名称为class的css类别时,删除该类别,否则增加一个该名称的CSS类别。

3.创建节点元素
Var $div = $(“<div>text</div>”);
$(“body”).append($div);

4.插入节点
1)内部插入节点
Append(content) 向所选择的元素内部插入内容
Append(function(index,html))
appendTo(content) 把所选择的元素追加到另一个指定的元素集合中
prepend(content),prepend(function(index,html))向每个所选择的元素内部前置内容
prependTo(content)

2)外部插入节点
After(content),after(function) 向所选择的元素外部后面插入内容
Before(content),before(function)向所选择的元素外部前面插入内容
InsertAfter(content),insertBefore(content)将所选择的元素插入到另一个指定元素外部的后面后者前面

5.复制节点
Clone()复制元素,复制后的新元素不具有任何元素行为
Clone(true)复制后新元素具有所有的事件

6.替换节点
ReplaceWith(content)将元素替换成指定的HTML或者DOM元素
ReplaceAll(selector)将所有选择的元素替换成指定selector的元素
$(“<span>test</span>”).replaceAll(“#span1”);

7.包裹节点
Wrap(html)把所有选择的元素用其他字符串代码包裹起来
Wrap(elem),wrap(fn)
Unwrap()移除所选元素的父元素或包裹标记
WrapAll(html)把所有的元素用单个元素包裹起来
WrapAll(elem),wrapAll(elem)
wrapInner(html),wrapInner(elem),wrapInner(fn)把所有选择的元素的子内容包裹起来

8.遍历元素
$(“img”).each(function(index) { this.title = index + this.alt })

9.删除元素
Remove([expr])删除jquey表达式匹配的元素,也可以为空。
Empry()清空所选择的页面元素或所有的后代元素
分享到:
评论

相关推荐

    jQuery操作DOM解析

    **jQuery操作DOM解析** 在Web开发中,DOM(Document Object Model)是HTML或XML文档的结构化表示,它允许程序和脚本动态更新、添加、删除和改变元素。jQuery库简化了JavaScript对DOM的操作,提供了丰富的API来处理...

    Ch08-jQuery操作DOM核心笔记.txt

    Ch08-jQuery操作DOM核心笔记.txtCh08-jQuery操作DOM核心笔记.txt Ch08-jQuery操作DOM核心笔记.txtCh08-jQuery操作DOM核心笔记.txt Ch08-jQuery操作DOM核心笔记.txt

    《jQuery权威指南》学习笔记之第3章 jQuery操作DOM

    在深入探讨jQuery操作DOM的详细知识点之前,先简要介绍一下jQuery。jQuery是一个高效、简洁的JavaScript库,它极大地简化了JavaScript代码的编写,特别是在处理HTML文档对象模型(DOM)、事件处理、动画效果以及Ajax...

    利用面向对象管理者模式思想结合jquery操作DOM树制作的植物大战僵尸

    《利用面向对象管理者模式思想结合jQuery操作DOM树制作的植物大战僵尸》 在JavaScript开发领域,游戏开发是一项挑战性极高的工作,它需要开发者具备深厚的编程基础、良好的逻辑思维以及对用户交互的深入理解。本...

    JQuery DoM和ajax 操作

    **jQuery DOM操作** jQuery库是JavaScript的一个强大工具,它极大地简化了对DOM(Document Object Model)的操作。DOM是HTML和XML文档的结构化表示,允许我们通过编程方式访问和修改页面内容。jQuery提供了丰富的...

    Jsoup HTML解析器For Java 在Java程序中使用JQuery操作DOM

    Jsoup HTML解析器For Java 在Java程序中使用JQuery操作DOM 模式识别的新技术 狂顶

    JQuery操作DOM元素

    该文档包含了样式操作,内容及Value属性值操作,节点操作,节点属性操作,节点遍历操作的基础知识,也许不够详细,但内容也应该足够平时操作了,希望能帮到大家

    jQuery一个非常流行的操作Dom的JavaScript库

    **jQuery:DOM操作的JavaScript库** jQuery是一款广泛应用于Web开发的JavaScript库,它极大地简化了JavaScript对DOM(Document Object Model)的操作,同时也提供了丰富的事件处理、动画效果和Ajax交互功能。自2006...

    jquery 操作DOM的基本用法分享

    接下来,我们将深入探讨 jQuery 在操作 DOM 方面的一些基本用法。 首先,使用 jQuery 选择器选取 DOM 元素是最基础的操作之一。jQuery 选择器能让我们快速选中页面中的元素,例如使用 `$("ul li:eq(1)")` 可以选取...

    jQuery 选择器 操作DOM 事件处理 动画基础

    jQuery选择器 jQuery操作DOM jQuery事件处理 jQuery动画基础

    jQuery随手笔记之常用的jQuery操作DOM事件

    Dom是Document Object Model的缩写,意思是文档...DOM是一种与浏览器、平台、语言无关的接口,使用该接口可以轻松访问页面中所有的标准组件,本文给大家介绍jQuery随手笔记之常用的jQuery操作DOM事件,需要的朋友参考下

    jQuery操作DOM之获取表单控件的值

    在jQuery中,操作DOM(文档对象模型)是常见的任务,特别是在处理用户交互和表单数据时。本篇文章将深入探讨如何使用jQuery获取表单控件的值,这在Web开发中是非常关键的一部分。 首先,了解HTML属性与DOM属性之间...

    Jquery+dom+easyUI教程

    jQuery 是一个广受欢迎的 JavaScript 库,其核心理念是简化 DOM 操作,处理事件和创建动画,同时提供了统一的 API 以实现跨浏览器兼容性。jQuery 的“write less, do more”口号反映了它通过简洁的语法实现高效的...

    jQuery DOM节点操作源码

    在"jQuery DOM节点操作源码"中,我们可以深入理解jQuery是如何优雅地处理DOM(Document Object Model)节点的。以下是关于jQuery DOM操作的一些关键知识点: 1. **选择器**:jQuery 的核心功能之一就是强大的选择器...

    使用jQuery操作DOM的方法小结

    本文将详细介绍如何使用jQuery来操作DOM,包括样式操作、内容操作、节点属性操作和DOM操作的分类。 首先,需要了解的是DOM(文档对象模型)是一种平台和语言无关的接口,它允许程序和脚本动态地访问和更新文档的...

    jQuery操作DOM_动力节点Java学院整理

    动力节点Java学院整理的这篇文章将详细讲解如何使用 jQuery 进行 DOM 操作。 首先,文章指出 jQuery 选择器的强大之处在于它简单灵活,能够轻易获取和操作 DOM 元素。在原生 JavaScript 中,修改 DOM 元素的 CSS、...

    jQuery基础DOM和CSS操作源码

    DOM(Document Object Model)是HTML和XML文档的结构化表示,jQuery提供了简便的方法来操作DOM元素。例如,`$()`函数是jQuery的核心,它可以用来选择DOM元素,如`$("#elementID")`选择ID为"elementID"的元素,`$("....

    jquery经典教程第八章节

    2. **DOM操作**:jQuery提供了一系列方法用于DOM元素的增删改查。例如,`$(html)`可以创建新的DOM元素,`.append()`将内容添加到元素末尾,`.prepend()`则在元素开头插入内容,`.remove()`则删除元素。 3. **事件...

    近百个jQuery实例

    jQuery操作DOM节点、数组和字符串 jQuery表单验证 jQuery事件处理 jQuery页面导航(这部分内容较少,增加了几个纯CSS实现) jQuery视觉特效(这部分内容最丰富)。 每个实例都有简洁的注释,基本上原书的精髓都汇聚...

Global site tag (gtag.js) - Google Analytics