1.DOM操作分为三类:
(1)DOM Core:任何一种支持DOM的编程语言都可以使用用它
如:getElementById()
(2)HTML-DOM:用于处理HTML文档,如document,forms
(3)CSS-DOM:用于操作CSS,如:element.style.color="green";

2.直接设置样式css():
(1)css(name,value);
(2)css({name:value,name:value,name:value});

3.追加和移除样式:、
(1)追加样式
addClass(class)
addClass(class1 class2.....)
(2)移除样式
removeClass("style2")
removeClass("style1 style2")

4.切换样式:
toggleClass() 模拟了addClass()与removeClass()实现样式切换的过程

5.html()和test()的区别:
html() 用于获取第一个匹配元素的HTML内容或文本内容
html(content) 用于设置所有匹配元素的HTML内容或者文本内容
text() 用于获取所有匹配元素的文本内容
text(content) 用于设置所有匹配元素的文本内容

6.value值操作:
获取value值:$(this).val();
改变value值:$(this).val("");

7.工厂函数$()用于获取或创建节点
$(selector):通过选择器获取节点
$(element):把DOM节点转化为JQuery节点
$(html):使用HTML字符串创建JQuery节点

8.插入子节点:
append(contend) $(A).append(B)表示将B追加到A中
appendTo(contend) $(A).appendTo(B)表示将A追加到B中
prepend(contend) $(A).prepend(B)表示将B前位置插入到A中
prependTo(contend) $(A).prependTo(B)表示将A前位置插入到B中

9.插入同辈节点:
after(contend) $(A).after(B)表示将B插入到A之后
insertAfter(contend) $(A).insertAfter(B)表示将A插入到B之后
before(contend) $(A).before(B)表示将B插入到A之前
insertBefore(contend) $(A).insertBefore(B)表示将A插入到B之前

10.替换节点:
replaceWith():后面一个节点替换掉前面一个节点
replaceAll():前面一个节点替换掉后面一个节点

11.复制节点:clone()用于复制某个节点

12.删除节点:
remove():删除整个节点
detach():删除整个节点,保留元素的绑定事件,附加的数据
empty():清空节点内容

13.获取和设置节点属性:
attr():获取节点属性
attr({属性:"值1",属性:"值2"}):设置节点属性

14.删除属性:removeAttr();

15.遍历子节点:children()方法可以用来获取元素的所有子元素
注:在方法括号中写上选择器,表示子元素中哪一个

16.遍历同辈元素:
next([expr]) 用于获取紧邻匹配元素之后的元素
prev([expr]) 用于获取紧邻匹配元素之前的元素
siblings([expr])用于获取位于匹配元素前面和后面的所有同辈元素
注:括号里面可以加上选择器,表示选定某些元素

17.遍历前辈节点:
parent():获取元素的父级元素
parents():获取元素的祖先元素

18.CSS-DOM
css() 设置或返回匹配元素的样式属性
height([value]) 设置或返回匹配元素的高度
width([value]) 设置或返回匹配元素的宽度
offset([value]) 返回以像素为单位的top和left坐标,此方法仅对可见元素有效。

第四章 jQuery节点操作的更多相关文章

  1. 第四章 DOM节点操作

    1.什么是DOM:DOM(document object model)文档对象模型,把每一个元素看做是一个节点,然后对节点进行增删改查的操作 2.DOM的分类:(1)Core Dom:可以对html, ...

  2. jQuery系列 第四章 jQuery框架的选择器

    第四章 jQuery框架的选择器 4.1 jQuery选择器说明 jQuery 最核心的组成部分就是选择器引擎.它完全继承了 CSS 的风格,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确 ...

  3. 深入学习jQuery节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]删除节点[4]复制节点[5]替换节点[6]包裹节点 前面的话 DOM节点操作包括创建节点.插入节点.移除节点.替换节点和复制节点.jQuery也有类似的 ...

  4. jQuery系列 第三章 jQuery框架操作CSS

    第三章 jQuery框架操作CSS 3.1 jQuery框架的CSS方法 jQuery框架提供了css方法,我们通过调用该方法传递对应的参数,可以方便的来批量设置标签的CSS样式. 使用JavaScr ...

  5. js 第四章 cookie的操作

    js 第四章 cookie的操作 一.学习要点 掌握cookie的简单应用 二. js 第四章 cookie的操作 了解cookie 什么是cookie? cookie 是存储于访问者的计算机中的变量 ...

  6. 第6章 DOM节点操作

    一.创建节点 为了使页面更加智能化,有时我们想动态的在 html 结构页面添加一个元素标签,那么 在插入之前首先要做的动作就是:创建节点. varbox=$('<div id="box ...

  7. jQuery节点操作,jQuery插入节点,jQuery删除节点,jQuery Dom操作

    一.创建节点 1 var box = $('<div>节点</div>'); //创建一个节点,或者var box = "<div>节点</div& ...

  8. 51 jquery 节点操作和 bootstrapt

    jquery 和 bootstrapt1.jquery each 函数 1.each 循环方式一: 可循环对象: var arr =["alex","deng" ...

  9. JQuery --- 第五期 (JQuery节点操作)

    学习笔记 1.JQuery添加节点相关方法 <!DOCTYPE html> <html lang="en"> <head> <meta c ...

随机推荐

  1. 【Manacher算法】最长子回文串

    [Manacher算法] 这个算法用来找出一个字符串中最长的回文子字符串. 如果采取暴力解最长回文子字符串问题,大概可以有两种思路:1. 遍历出所有子字符串找其中最长的回文 2. 从每个字符作为中心, ...

  2. Direct3D 11 Tutorial 2: Rendering a Triangle_Direct3D 11 教程2:渲染一个三角形

    概要 在之前的教程中,我们建立了一个最小的Direct3D 11的应用程序,它用来在窗口上输出一个单一颜色.在本次教程中,我们将扩展这个应用程序,在屏幕上渲染出一个单一颜色的三角形.我们将通过设置数据 ...

  3. ABAP 文件选择框

    GUI_FILE_SAVE_DIALOG    CALL METHOD CL_GUI_FRONTEND_SERVICES=>DIRECTORY_BROWSE         EXPORTING ...

  4. [转]SpringMVC+ Mybatis 配置多数据源 + 手动切换数据源

    正确可行的解决方法:使用Spring提供的AbstractRoutingDataSource类来根据请求路由到不同的数据源.具体做法是先设置两个不同的dataSource代表不同的数据源,再建一个总的 ...

  5. Cesium打包命令

    package.json中 (1) npm run build Source/Cesium.js 仅是把Cesium源码中一千两百多个js文件做了一下引用,并不会进行打包 所以这个Cesium.js也 ...

  6. Python判断列表是否已排序的各种方法及其性能分析

    目录 Python判断列表是否已排序的各种方法及其性能分析 声明 一. 问题提出 二. 代码实现 2.1 guess 2.2 sorted 2.3 for-loop 2.4 all 2.5 numpy ...

  7. Qt编写视频监控画面分割界面(开源)

    其实qt应用在安防领域还是蛮多的,尤其是视频监控系统,但是网上几乎没有看到qt做的最基础的视频监控画面分割的demo,今天特意花几分钟提取出来,开源放出来.欢迎大家多多点赞!源码下载:点击打开链接 运 ...

  8. linux部署的flask项目配置static

    环境: Python2.7 flask nginx linux的系统是Ubantu Python:我的是linux已经有的. flask:pip install flask nginx:sudo ap ...

  9. PHP异常处理、错误捕获和自动加载的一些总结

    <?php // 设置顶层异常处理器 set_exception_handler('exceptionHandler'); function exceptionHandler($e) { ech ...

  10. 关于 ubuntu 下 防火墙 ufw的使用

    ufw 是 iptables 的一个语法糖.详细介绍