jQuery 常用选择器和和方法

学习总结
总结

学习总结

参考博文：
https://blog.csdn.net/h13783313210/article/details/79832318

一、JQuery 介绍

1. 什么是 jQuery

1）jQuery 是一个 JavaScript 函数库；
2）jQuery 是轻量级的 JS 库，它兼容 CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）；
3）jQuery 是免费、开源的；
4）jQuery 是一个兼容多浏览器的 Javascript 库，核心理念是 write less，do more（写得更少，做得更多）。

2. jQuery 版本介绍

1）jQuery1.x：经典版本，兼容 IE6，7，8。
2）jQuery2.0：改进版本，及后续版本将不再支持 IE6，7，8 浏览器。

3. jQuery 文件介绍

1）jQuery1.x.js：jQuery 源文件；学习 jQuery 或者 debug 的时候使用。
2）jQuery1.x.min.js：jQuery 压缩之后的文件；正常项目中使用。

二、jQuery 对象

1. jQuery 和 DOM 的区别

通过 document.getElementById() 找到的元素和通过 $() 找不到元素不一样：
1）通过 jQuery 方法获取的页面元素，都是 jQuery 对象。
2）Query 对象其实就是对 DOM 对象进行了包装，增强了相关方法，让开发者使用起来更加便利。
3）虽然 jQuery 对象包装了 DOM 对象但是两者不能混用，各位可以理解为 jQuery 对象与 DOM 对象是两个不类型的对象，但是我们调用 jQuery 对象的方法，事实上底层代码还是操作的是 DOM 对象。

2. jQuery 对象与 DOM 对象之间转换

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="/static/jQuery-1.11/jquery-1.11.3.min.js"></script>

    // 都是一个函数

    <script> console.log($ === jQuery);

        window.onload = function () {

            let btn = document.getElementById("btn");

            console.log(btn);

            // 通过 jQuery 获取 属性值

            let $btn = $('#btn');

            console.log($btn);

            // DOM 对象转 jQuery

            console.log($(btn));

            // jQuery 对象转成 DOM 对象，这个很少用，直接获取数组第一个值

            console.log($btn.get(0));

            // 以后尽量使用 jQuery 方法操作页面元素，绑定事件等

        }

    </script>

</head>

<body>

<button id="btn">按钮</button>

</body>

</html>

3. 自执行函数（三种）

表示文档结构已经加载完成（不包含图片等非文字媒体文件），onload 则指示页面包含图片等文件在内的所有元素都加载完成。

<script>

	$(function(){

		// do something

	})

</script>

<script>

	$(document).ready(function(){

		//do something

	})

</script>

<script>

	$().ready(function(){

		//do something

	})

</script>

三、jQuery 对象常用方法

1. 常用方法

val()

作用：val() 方法返回或设置被选元素的 value 属性。

方法名	作用
$(selector).val()	用于返回值：该方法返回第一个匹配元素的 value 属性的值
$(selector).val(value)	用于设置值：该方法设置所有匹配元素的 value 属性的值\

注意：val() 方法通常与 HTML 表单元素一起使用。

text()

作用：text() 方法设置或返回被选元素的文本内容。

方法名	作用
$(selector).text()	用于返回内容：返回所有匹配元素的文本内容（会删除 HTML 标记）
$(selector).text(content)	用于设置内容：重写所有匹配元素的内容

注意：text() 方法返回内容时会删除 HTML 标签

html()

作用：html() 方法设置或返回被选元素的内容（innerHTML）。

方法名	作用
$(selector).html()	用于返回内容：返回第一个匹配元素的内容
$(selector).html(content)	用于设置内容：重写所有匹配元素的内容

注意：html() 方法返回内容时不会删除 HTML 标签

css()

作用：css() 方法设置或返回被选元素的一个或多个样式属性。

方法名	作用
css(“propertyname”)	返回指定的 CSS 属性的值（无指定则返回第一个）
css(“propertyname”, “value”)	设置指定的 CSS 属性值（无指定则设置全部）

get() 非ajax用法

作用：get() 方法获取由选择器指定的 DOM 元素。

方法名	作用
$(selector).get( index)	index 可选。规定要获取哪个匹配的元素（通过 index 编号）。

parent()

作用：parent() 方法返回被选元素的直接父元素。

方法名	作用
$(selector).parent(filter)	filter 可选。规定缩小搜索父元素范围的选择器表达式。

children()

作用：children() 方法返回被选元素的所有直接子元素。

方法名	作用
$(selector).children(filter)	filter 可选。规定缩小搜索子元素范围的选择器表达式。

parents()

作用：parents() 方法返回被选元素的所有祖先元素。

方法名	作用
$(selector).parents(filter)	filter 可选。规定缩小搜索祖先元素范围的选择器表达式。

注意：如需返回多个祖先，请使用逗号分隔每个表达式。

find()

作用：方法返回被选元素的后代元素。

方法名	作用
$(selector).find(filter)	filter 必需。过滤搜索后代条件的选择器表达式、元素或 jQuery 对象。

注意：如需返回多个后代，请使用逗号分隔每个表达式。

eq()

作用：方法返回带有被选元素的指定索引的元素（索引号从 0 开头）。

方法名	作用
$(selector).eq(index)	index 必需。规定元素的索引。可以是整数或负数。

注意：使用负数将从被选元素的结尾开始计算索引。

siblings()

作用：方法返回被选元素的所有同级元素。同级元素是共享相同父元素的元素。

方法名	作用
$(selector).siblings(filter)	filter 可选。规定缩小搜索同级元素范围的选择器表达式。

index()

作用：方法返回指定元素相对于其他指定元素的 index 位置，这些元素可通过 jQuery 选择器或 DOM 元素来指定。

方法名	作用
$(selector).index()	获得第一个匹配元素相对于其同胞元素的 index 位置。
$(selector).index(element)	获得元素相对于选择器的 index 位置 element，规定要获得 index 位置的元素。可以是 DOM 元素或 jQuery 选择器。

注意：如果未找到元素，index() 将返回 -1。

height()

作用：height() 方法设置或返回被选元素的高度。

方法名	作用
$(selector).height()	用于返回高度：返回第一个匹配元素的高度
$(selector).height( value)	用于设置高度：对于em, pt, etc要使用""，px为默认单位，直接写数值
$(selector).height(function (index,currentheight))	value - 当设置高度时是必需的。规定元素的高度，单位为 px、em、pt 等。 function(index,currentheight) - 可选。规定返回被选元素新高度的函数。index - 返回集合中元素的 index 位置。currentheight - 返回被选元素的当前高度。

注意：如果未找到元素，index() 将返回 -1。

trim()

作用：$.trim() 函数用于去除字符串两端的空白字符。

方法名	作用
$.trim( str )	str 必选。String 类型，需要去除两端空白字符的字符串。

注意：$.trim()函数会移除字符串开始和末尾处的所有换行符，空格(包括连续的空格)和制表符。如果这些空白字符在字符串中间时，它们将被保留，不会被移除。

2. jQuery 常用 DOM 节点操作方法（添加、删除、复制节点）

添加节点

方法名	作用
$(selector).append()	指定元素内部添加，在被选元素的结尾插入内容
$(selector).prepend()	指定元素内部添加，在被选元素的开头插入内容
$(selector).after()	指定元素外部添加，在被选元素之后插入内容
$(selector).before()	指定元素外部添加，在被选元素之前插入内容

删除节点

方法名	元素所绑定的事件及数据是否也被移除	作用
$(selector).empty()	是	从被选元素中删除子元素，删除的是子节点，自身不变。empty()函数的返回值为jQuery类型，返回当前jQuery对象本身(以便于进行链式风格的编程)。
$(selector).remove()	是	删除被选元素（及其子元素），这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外，其他的比如绑定的事件，附加的数据等都会被移除。remove()函数的返回值为jQuery类型，返回当前jQuery对象本身。
$(selector).detach()	否	删除被选元素（及其子元素）,事件和附加数据保留。detach()函数的返回值为jQuery类型，返回当前jQuery对象本身。

复制节点

方法名	作用
$(selector).clone()	复制所匹配的元素

替换节点

方法名	作用
$(selector).replaceWith()	将所有匹配的元素用特定内容替换
$(selector).replaceAll()	作用相同,颠倒了主宾关系

3. jQuery 元素属性操作的方法

3.1 操作 class 属性

addClass()

作用：addClass() 方法向被选元素添加一个或多个类名。

方法名	作用
$(selector).addClass(classname)	classname - 必需。该方法不会移除已存在的 class 属性，仅仅添加一个或多个类名到 class 属性。提示：如需添加多个类，请使用空格分隔类名。
$(selector).addClass( classname,function(index,oldclass))	function() - 可选。规定返回一个或多个待添加类名的函数。 index - 返回集合中元素的 index 位置。currentclass - 返回被选元素的当前类名。

removeClass()

作用：removeClass() 方法从被选元素移除一个或多个类。

方法名	作用
$(selector).addClass(classname)	classname - 可选。规定要移除的一个或多个类名称。如需移除若干个类，请使用空格分隔类名称。注意：如果该参数为空，则将移除所有类名称。
$(selector).removeClass( classname,function(index,currentclass))	function() - 可选。规定返回一个或多个待添加类名的函数。 index - 返回集合中元素的 index 位置。currentclass - 返回被选元素的当前类名。

注意：如果没有规定参数，则该方法将从被选元素中删除所有类。

hasClass()

作用：hasClass() 方法检查被选元素是否包含指定的类名称。

方法名	作用
$(selector).hasClass(classname)	classname - 必需。规定需要在被选元素中查找的类。

注意：如果没有规定参数，则该方法将从被选元素中删除所有类。

toggleClass()

作用：toggleClass() 方法对添加和移除被选元素的一个或多个类进行切换。该方法检查每个元素中指定的类。如果不存在则添加类，如果已设置则删除。这就是所谓的切换效果。然而，通过使用 “switch” 参数，您能够规定只删除或只添加类。

方法名	作用
$(selector).toggleClass(classname, function(index,currentclass),switch)	classname - 必需。规定添加或移除的一个或多个类名。如需规定若干个类，请使用空格分隔类名。 function() 可选。规定返回需要添加/删除的一个或多个类名的函数。 index - 返回集合中元素的 index 位置。 currentclass - 返回被选元素的当前类名。 switch - 可选。布尔值，规定是否仅仅添加（true）或移除（false）类。

方法名

作用

$(selector).toggleClass(classname,
function(index,currentclass),switch)

classname - 必需。规定添加或移除的一个或多个类名。如需规定若干个类，请使用空格分隔类名。
function() 可选。规定返回需要添加/删除的一个或多个类名的函数。
index - 返回集合中元素的 index 位置。
currentclass - 返回被选元素的当前类名。
switch - 可选。布尔值，规定是否仅仅添加（true）或移除（false）类。

注意：如果没有规定参数，则该方法将从被选元素中删除所有类。

3.2 操作 value 属性

val()

作用：val() 方法返回或设置被选元素的 value 属性。

方法名	作用
$(selector).val()	用于返回值：该方法返回第一个匹配元素的 value 属性的值
$(selector).val()	用于设置值：该方法设置所有匹配元素的 value 属性的值\

注意：val() 方法通常与 HTML 表单元素一起使用。

3.3 操作 css 属性

css()

作用：css() 方法设置或返回被选元素的一个或多个样式属性。

方法名	作用
css(“propertyname”)	返回指定的 CSS 属性的值（无指定则返回第一个）
css(“propertyname”, “value”)	设置指定的 CSS 属性值（无指定则设置全部）

3.4 操作 prop 属性

prop()

作用
1）prop() 方法设置或返回被选元素的属性和值。
2）当该方法用于返回属性值时，则返回第一个匹配元素的值。
3）当该方法用于设置属性值时，则为匹配元素集合设置一个或多个属性/值对。

方法名	作用	参数描述
$(selector).prop(property)	返回属性的值	property - 规定属性的名称
$(selector).prop(property,value)	设置属性和值	property - 规定属性的值
$(selector).prop(property, function(index,currentvalue))	使用函数设置属性和值	function(index,currentvalue) - 规定返回要设置的属性值的函数； index - 检索集合中元素的 index 位置； currentvalue - 检索被选元素的当前属性值
$(selector).prop({property:value, property:value,…})	设置多个属性和值	property - 规定属性的名称

注意：prop() 方法应该用于检索属性值，例如（selected、checked）

3.5 操作 data 属性

data()

作用：data 方法，针对 data- 开头的属性的获取，若值是 JSON 格式, 自动转成 JS 对象。

方法名	作用	参数描述
$(selector).data(name)	从被选元素中返回附加的数据	name - 可选，为data-后面的名称。规定要取回的数据的名称；如果没有规定名称，则该方法将以对象的形式从元素中返回所有存储的数据。
$(selector).data(name,value)	向被选元素附加数据	name - 必需。规定要设置的数据的名称； value - 必需。规定要设置的数据的值。

代码演示：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.min.js">

</script>

<script>

$(document).ready(function(){

	testObj=new Object();

	testObj.greetingMorn="Good Morning!";

	testObj.greetingEve="Good Evening!";

	$("#btn1").click(function(){

		$("div").data(testObj);

	});

	$("#btn2").click(function(){

		alert($("div").data("greetingEve"));

	});

});

</script>

</head>

<body>

<button id="btn1">将数据附加到div元素</button><br>

<button id="btn2">获取数据附加到div元素</button>

<div></div>

</body>

</html>

3.5 操作 attr 属性

attr()

作用：attr() 方法设置或返回被选元素的属性和值。

方法名	作用	参数
$(selector).attr(attribute)	name - 可选。返回第一个匹配元素的值	attribute - 规定属性的名称
$(selector).attr(attribute,value)	为匹配元素设置一个或多个属性/值对	value - 规定属性的值
$(selector).attr(attribute,function( index,currentvalue))	可选。返回第一个匹配元素的值	规定要返回属性值到集合的函数 index - 接受集合中元素的 index 位置 currentvalue - 接受被选元素的当前属性值
$(selector).attr({attribute: value,attribute: value,…}	为匹配元素设置一个或多个属性/值对

小结： 下面是每个属性对应方法的选取

<script>

    $(function () {

        // css 方法针对 style 属性

        console.log($('#gender').css('color'));

        // val 方法针对 value 属性

        console.log($('#gender').val());

        // addClass 方法、removeClass 方法，针对 class 属性

        $('#gender').addClass('other');

        $('#gender').removeClass('other');

        // prop 方法针对 checked 属性 selected 属性

        console.log($('#gender').prop('checked'));

        $('#gender').prop('checked', false)

        // data 方法，针对 data- 开头的属性的获取，若值是 JSON 格式, 自动转成 JS 对象

        console.log($('#gender').data('option'));

        // 其他情况使用 attr 方法

    });

    </script>

4. jQuery中each的三种遍历方法

jQuery中each的三种遍历方法：博客地址

四、jQuery 选择器

1. 基本选择器

实例	选取
$("*")	所有元素
$("#lastname")	id=“lastname” 的元素
$(".intro")	所有 class=“intro” 的元素
$(“p”)	所有 p 元素
$(".intro.demo")	所有 class=“intro” 且 class=“demo” 的元素

2. 属性选择器

实例	选取
$("[href]")	所有带有 href 属性的元素
$("[href=’#’]")	所有 href 属性的值等于 “#” 的元素
$("[href!=’#’]")	所有 href 属性的值不等于 “#” 的元素
$ ("[href$=’.jpg’]")	所有 href 属性的值包含以 “.jpg” 结尾的元素
$(“th,td,.intro”)	所有带有匹配选择的元素
$(":selected")	:selected 选择器选取被选择的 option 元素
$(":checked")	:checked 选择器选取被选择的 checkbox/radio 元素

案例代码：

<script>

   // 定义一个数组接受复选框里面的 value 值

   var ids = [];

   $('input[name=ids]:checked').each(function () {

   		// 把被选中的 checkbox 中的 value 值添加到数组中

        ids.push(this.value);

    });

    // 判断 复选框是否有被选中的

    if ($('input[name=ids]:checked').length > 0) {

		$.ajax({

		   url: "/Xxx",

		   type: "POST",

		   data_type: 'json',

		   data: {

		       // JSON.stringify(value[, replacer[, space]])，转成 JSON 字符串，为空则请求失败

		       // "ids": JSON.stringify(ids),

		       "ids": ids,

		   },

		   traditional: true,//这里设置为true

		   success: function(data) {

		       // 删除被选中的复选框元素

			   $('input[name=ids]:checked').parent().parent().remove();

		   }

		});

	}

</script>

<tbody>

	<#list consumptionItems as consumptionItem>

	    <tr>

	        <td><input type="checkbox" name="ids" value="${consumptionItem.id}"></td>

	        <td>${consumptionItem.name}</td>

	        <td>${consumptionItem.createDate}</td>

	    </tr>

	</#list>

</tbody>

3. 层次选择器

实例	选取
$("#myid a")	获取所有子孙后代元素列表
$("#myid>a")	获取一级子元素列表（不包含孙元素）
$("#myid+a")	获取紧接在之后的同辈元素列表，等价于$("#myid>a").next(“a”)
$("#myid~a")	获取之后的所有同辈元素列表，等价于$("#myid").nextAll(“a”)
$("#myid").siblings(“a”)	获取所有同辈元素列表，无论前后
$("#myid").prev(“a”)	获取紧接在之后的同辈元素列表
$("#myid").find(“a”)	获取后代元素中所有的a(包含子孙后代)

案例代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>jQuery 层次选择器</title>

    <script type="text/javascript" src="/static/jQuery-1.11/jquery-1.11.3.min.js">

    </script>

    <style type="text/css"> .selected{background-color: gray;}</style>

    <script>

        $(function () {

            // 问题 1：获取所有 ul 下的所有 li 元素，并打印分析结果

            console.log($('ul li'));    // 输出了 8 个 li，中间空格表示获取所有子孙后代 li 元素

            // 问题 2：获取 id 为 myul 下的所有一级 li 子元素，并打印分析结果

            console.log($('#myul > li'));   // 输出了 4 个 li，中间 > 表示获取一级子元素

            // 问题 3：获取所有 label 元素后的 input 元素，并打印分析结果

            console.log($('label ~  input'));   // 输出结果为（text1、text2、text3、text4）

            // 问题 4：获取紧跟着 label 元素后的 input 元素，并打印分析结果

            console.log($('label + input'));    // 输出结果为（text1、text3）

        });

    </script>

</head>

<body>

<ul id="myul">

    <li>item1</li>

    <li>item2</li>

    <li>item3</li>

    <li>

        <ul>

            <li>item1</li>

            <li>item2</li>

            <li>item3</li>

            <li>item4</li>

        </ul>

    </li>

</ul>

<label>LABEL1</label>

<input type="text" value="text1"/>

<input type="text" value="text2"/>

<br/>

<label>LABEL2</label>

<input type="text" value="text3"/>

<input type="text" value="text4"/>

<br/>

<label>

    LABEL3

    <input type="text" value="text5"/>

    <input type="text" value="text6"/>

</label>

</body>

</html>

4. 过滤选择器

实例	选取
$(“p:first”)	第一个 p 元素
$(“p:last”)	最后一个 p 元素
$(“tr:even”)	所有偶数 tr 元素
$(“tr:odd”)	所有奇数 tr 元素
$(“ul li:eq(3)”)	列表中的第四个元素（index 从 0 开始）
$(“ul li:gt(3)”)	列出 index 大于 3 的元素
$(“ul li:lt(3)”)	列出 index 小于 3 的元素
$(“input:not(:empty)”)	所有不为空的 input 元素
$(":header")	所有标题元素 h1 - h6
$(":contains(‘W3School’)")	包含指定字符串的所有元素
$(“p:hidden”)	所有隐藏的元素

5. 表单元素获取

实例	选取
$(":input")	所有元素
$(":text")	所有 type=“text” 的元素
$(":password")	所有 type=“password” 的元素
$(":radio")	所有 type=“radio” 的元素

五、DOM节点

博客地址：DOM节点的使用（常用方法+代码）

六、综合小例题

例题一：JS实现列表移动（通过document操作select标签）
例题二：用 JS（JavaScript ）实现增删改查
例题三：用 JS（JavaScript ）实现多选框的全选、反选、多选
例题四：jQuery 实现全选、多选、反选
例题五：JS 实现下拉框回显
例题六：JS 实现列表移动
例题七：JS 实现下拉框去重

总结

以上就是对 JavaScript 入门的总结了，代码仅供参考，欢迎讨论交流。
DOM节点的应用请看这篇博客：DOM节点的使用（常用方法+代码）

jquery 常用选择器和方法以及遍历（超详细）的更多相关文章

jquery常用函数与方法汇总
1.delay(duration,[queueName]) 设置一个延时来推迟执行队列中之后的项目. jQuery1.4新增.用于将队列中的函数延时执行.他既可以推迟动画队列的执行,也可以用于自定义队 ...
jQuery常用选择器总结
jQuery常用选择器总结: 我们都知道jQuery是JavaScript(JS)的框架,它的语法简单使用方便,被广大开发人员青睐.现在我就它常用的并且十分强大的选择器的方式,做一个总结.鉴于它的选择 ...
JQuery常用API 核心效果 JQueryHTML 遍历 Event事件
JQuery 常用API 参考资料:JQuery 官网 jQuery API 中文文档核心 jQuery 对象 jQuery() 返回匹配的元素集合,无论是通过在DOM的基础上传递的参数还是创建 ...
jquery常用的一些方法
一.选择网页元素(标签选择器) $(document) //选择整个文档对象 $('#myId') //选择ID为myId的网页元素 $('div.myClass') // 选择class为myCla ...
jquery常用选择器（转）
jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个 ...
jquery常用函数与方法
1.delay(duration,[queueName]) 设置一个延时来推迟执行队列中之后的项目.jQuery 1.4新增.用于将队列中的函数延时执行.他既可以推迟动画队列的执行,也可以用于自定义队 ...
js和jQuery常用选择器
笔者觉得js是前台基础中的基础,而其选择器则是js基础中的基础,因长期使用框架导致js生疏,所有查资料,回顾一下js的常用选择器: 1.document.getElementById("id ...
jquery 常用选择器基础语法学习
siblings方法的常用应用场景:选中高亮实现代码 <!DOCTYPE html> <html> <head> <meta charset="U ...
jquery常用选择器和常用方法
基本选择器 $(”#myDiv”) //匹配唯一的具有此id值的元素 $(”div”) //匹配指定名称的所有元素 $(”.myClass”) //匹配具有此class样式值的所有元素 $(”*”) ...

随机推荐

Spark中的Wordcount
目录通过scala语言基于local编写spark的Wordcount 基于yarn去调度WordCount 通过scala语言基于local编写spark的Wordcount import org ...
Actor model 的理解与 protoactor-go 的分析
Overview Definition From wikipedia The actor model in computer science is a mathematical model of co ...
微服务7：通信之RPC
★微服务系列微服务1:微服务及其演进史微服务2:微服务全景架构微服务3:微服务拆分策略微服务4:服务注册与发现微服务5:服务注册与发现(实践篇) 微服务6:通信之网关微服务7:通信之RPC ...
ArcMap操作随记（4）
1.统计各省份公路长度 [标识]→[汇总]→[视图][创建] 2.用户登录分配 [创建渔网]→[连接] 3.城市超市影响范围 [创建泰森多边形]→[标识]→[汇总] 4.三维可视化分析 [构造视线]→ ...
除非Windows Activation Service (WAS)和万维网发布服务(W3SVC)均处于运行状态，否则无法启动网站。
解决办法: 打开WINDOWS服务管理方法: 进入服务有二种方法: 1.开始-控制面板-管理工具单击,找到"服务"双击打开在WINDOWS服务管理里启动 World Wide ...
ybt1184：明明的随机数
[题目描述] 明明想在学校中请一些同学一起做一项问卷调查,为了实验的客观性,他先用计算机生成了N个1到1000之间的随机整数(N≤100),对于其中重复的数字,只保留一个,把其余相同的数去掉,不同的数 ...
GE PACSystems RX3i 输入验证漏洞
受影响系统:General Electric CPE100 < R9.85General Electric CPE115 < R9.85General Electric CPE302 &l ...
Numpy库基础___一
ndarray一个强大的N维数组对象Array •ndarray的建立(元素默认浮点数) 可以利用list列表建立ndarray import numpy as np list =[0,1,2,3] ...
Django之 rest_framework （一基本组件）
目录 RESTFUL 序列化视图三部曲认证与权限组件解析器分页 RESTFUL 一.什么是RESTFUL REST与技术无关代表的是一种软件架构风格,REST是Representational ...
解决metasploit的module load fail
解决metasploit的module load fail 在exploits文件夹下面新建一个文件夹test 把你要用的rb文件放进去 reload_all 就行了

jquery 常用选择器和方法以及遍历（超详细）

jQuery 常用选择器和和方法

学习总结

一、JQuery 介绍

1. 什么是 jQuery

2. jQuery 版本介绍

3. jQuery 文件介绍

二、jQuery 对象

1. jQuery 和 DOM 的区别

2. jQuery 对象与 DOM 对象之间转换

3. 自执行函数（三种）

三、jQuery 对象常用方法

1. 常用方法

2. jQuery 常用 DOM 节点操作方法（添加、删除、复制节点）

3. jQuery 元素属性操作的方法

3.1 操作 class 属性

3.2 操作 value 属性

3.3 操作 css 属性

3.4 操作 prop 属性

3.5 操作 data 属性

3.5 操作 attr 属性

4. jQuery中each的三种遍历方法

四、jQuery 选择器

1. 基本选择器

2. 属性选择器

3. 层次选择器

4. 过滤选择器

5. 表单元素获取

五、DOM节点

六、综合小例题

总结

jquery 常用选择器和方法以及遍历（超详细）的更多相关文章

随机推荐

热门专题