引入方式
<script src="jquery-3.4.1.js"></script> <script> jQuery代码 <script>
基本选择器
$('.d_1'); 类选择器 $('#d2'); id选择器 $('div'); 标签选择器
层级选择器
$('div p'); 选中div标签内的p标签 $('div .c1'); 选中div标签内的含有c1类的标签
基本筛选器
$('div:first'); 选中第一个div标签$('div:last'); 选中最后一个div标签$('div:eq(2)'); 选择索引为2的div标签$('div:has(span)'); 选择后代中包含span标签的div标签$('div:not(#d1)'); 选择id不为d1的div标签$('div:even'); 选中索引为偶数的div标签 $('div:odd'); 选中索引为奇数的div标签$('div:gt(2)'); 选中索引大于2的div标签$('div:lt(2)'); 选中索引小于2的div标签
属性选择器
$('[title]');$('[type=text]');$('[type!=text]');$('input[type=text]');
表单筛选器
$(':password');$(':text')
表单属性
$(':disabled'); 不可用的$(':checked'); 已选中的选择(单选/复选)框 $(':selected');已选中的下拉框 $(':enabled'); 可用的
筛选器方法
下方标签：同级$('#d2').next(); 选中id为d2的标签下方的一个同级标签 $('#d2').nextAll(); 选中id为d2标签下方所有的同级标签 返回一个列表，正序 $('#d2').nextUntil('#d4'); 选中id为d2标签下方到id为d4标签中的所有标签且不包含d4 返回一个列表，正序上方标签：同级$('#d2').prev(); 选中的id为d2的标签上方的一个同级标签$('#d2').prevAll(); 选中id为d2的标签上方的所有同级标签 返回一个列表，逆序$('#d2').prevUntil('#d'); 选中id为d2的标签上方的，与id为d标签之间的所有标签且不含d 返回一个列表，逆序向上查找：父级元素$('#d1').parent() 选中一个id为d1的标签上一级的父级标签$('#d1').parents() 选中所有id为d1的标签上一级的父级标签$('#d1').parentsUntil('body') 选中id为d1的标签之上到body标签之中包含的所有标签向下查找：子级标签$('#d2').children(); 选中id为d2的标签下所有的标签$('#d2').children('p'); 选中id为d2的标签下的p的标签同级查找：同级标签$('#d2').siblings(); 选择id为d2的标签同级的所有标签$('#d2').siblings('#d1'); 选择id为d2的标签同级的id为d1的标签find$('.c1').find('p') 找到c1后代的p标签 类似于后代选择器 .c1 pfilter $('.c1').filter('.c2') 从满足有c1类的标签中筛选出有c2类的标签 类似于组合选择器 .c1.c2
添加文本
d1.text('xxx'); 为id为d1的标签添加文本 d1[0].innerText='XXX'; 原生js添加文本
设置点击事件
$('.c1').click(function(){ $(this).css('background','red') })
转载于:https://www.cnblogs.com/lttlpp61007188/p/10834147.html
