常用的jQuery对象查找方法:find()方法在当前元素集合中查找匹配指定选择器的后代元素,并返回新的元素集合。...下面是find()方法的使用示例:$(".container").find("li");上述示例将在所有类名为.container的元素中查找所有的li>元素。...下面是children()方法的使用示例:$(".container").children("li");上述示例将选择所有类名为.container的元素中的直接子级li>元素。...parent()方法选择当前元素集合中每个元素的父级元素,并返回新的元素集合。下面是parent()方法的使用示例:$("li").parent();上述示例将选择所有li>元素的直接父级元素。...下面是siblings()方法的使用示例:$("li").siblings();上述示例将选择所有li>元素的同级元素。
这一步对jQuery来说是必须的,since jQuery operates on the one, baked-in DOM。通过Cheerio,我们需要把HTML document 传进去。...####Traversing .find(selector) 获得一个在匹配的元素中由选择器滤过的后代。...$('#fruits').find('li').length //=> 3 .parent([selector]) 获得每个匹配元素的parent,可选择性的通过selector筛选。...slice(1).eq(0).text() //=> 'Orange' $('li').slice(1, 2).length //=> 1 .siblings(selector) 获得被选择的同级元素...获被选择元素的子元素 $('#fruits').children().length //=> 3 $('#fruits').children('.pear').text() //=> Pear .
jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功。...,避免把事件处理器添加到多个子级元素上),它还可以让你在对象层的不同级别捕获事件。...’).on(事件属性,匿名函数)) DOM操作(节点操作) DOM: 网页文档的根/根标签 追加节点:同级追加和自己追加(前面 后面) 步骤: 声明变量保存的节点数据 使用追加函数追加节点 子级追加:...和 子级追加 (前面 后面) // 步骤:1、声明变量保存节点数据;2、使用追加函数追加节点 var $li = $('li>2222li>')...// ul子级追加 // $li.appendTo($('ul')) //结尾追加 // $('ul').append($li) // $li.prependTo
标签 说明: 可以使用length属性来判断标签是够选择成功,如果length大于0表示选择成功,否则选择失败。...元素的所有子元素 $('#box').siblings(); //表示选择id是box元素的所有同级元素 $('#box').find('.myClass'); //表示选择id是box元素的class...示例代码请私信作者哦 事件代理 1、事件代理介绍 事件代理就是利用事件冒泡的原理(事件冒泡就是事件会向它的父级一级一级传递),把事件加到父级上,通过判断事件来源,执行相应的子元素的操作,事件代理首先可以极大减少事件绑定次数...、然后执行子控件的相关操作 var $ul = $("div ul"); $ul.delegate("li","click",function(){...>哈哈li> li>嘻嘻li> li>美滋滋li> li>啦啦啦li> <p id="p2"
我需要读取所有被选中的checkbox 元素所在区域的某一元素值(举例下拉框的weight值)的总和 框架 :ThinkPHP 3.2.3 Ⅰ. html 源代码 如下的代码只是其中的一部分 li...class="li-user-addr" addr_id="{$vo.address_id}"> tip: I will find you !...allWeight = 0; //TODO 取出所有被选中的 checkbox 元素 var cb_checked = $('.cb_addr:checked'); var cblen = cb_checked.length...附录 参考文章: jquery选择器 之 获取父级元素、同级元素、子元素
.prevAll() 选中某个属性 = 某个值的标签,只要键值对存在 $('img[alt=aa]').css('background','green') 下面的环境都是父子集 has选中了谁的子级是...xx,父级执行了命令 find选中子集执行了命令 下面的选择器很重要 .parent()选择元素的父元素 可以先用一个this,然后找到这个元素的父级。....siblings()选择元素的同级别元素 -----排他思想:只许州官放火不许百姓点灯 先将自己控制一遍,然后调用siblings再把除了自己的其他同级元素控制一遍 这个 this jq中使用this...) mouseout()鼠标离开(离开子元素也触发) mouseenter()鼠标进入(进入子元素不触发) mouseleave()鼠标离开(离开子元素不触发) 上面的这些鼠标移入和离开,触发和不触发指的是不再次触发父级...验证两组不一样的时候,鼠标先进入父级,再进入子级,然后没有再次触发,验证成功。如果是直接进入子级的话,因为子级和父级是一体的,会触发。 <!
has 包含条件: $('div').has('p'); 包含 p 元素的 div 元素 2.判等条件: $('div').eq(5); 第 5 个 div 元素 3.寻找条件: $('#box').find...大可放心,jquery 有容错机制,即使没有找到元素,也不会出错。还为你提供了验证是否找到的方法,那便是 length 属性。...length 值为 0 时代表没选择到想要元素;为 1 则代表选择到了相应的元素。 除了选择元素,还可以选择样式呢!啥都能找到,强不强?既然都能找到了,重新赋值也必须到位!...) 5. mouseout() 鼠标离开(离开子元素也触发) 6. mouseenter() 鼠标进入(进入子元素不触发) 7. mouseleave() 鼠标离开(离开子元素不触发) 8. hover...答:事件冒泡允许多个操作被集中处理(把事件处理器添加到一个父级元素上,避免把事件处理器添加到多个子级元素上),它还可以让你在对象层的不同级别捕获事件。
jquery选择器 jquery用法思想一 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功...$('#myId') //选择id为myId的网页元素 $('.myClass') // 选择class为myClass的元素 $('li') //选择所有的li元素 $('#ul1 li span')...('div').nextAll(); //选择div元素后面所有的同辈元素 $('div').parent(); //选择div的父元素 $('div').children(); //选择div的所有子元素...$('div').siblings(); //选择div的同级元素 $('div').find('.myClass'); //选择div内的class等于myClass的元素 判断是否选择到了元素...jquery有容错机制,即使没有找到元素,也不会出错,可以用length属性来判断是否找到了元素,length等于0,就是没选择到元素,length大于0,就是选择到了元素。
>新闻二级菜单li> li>新闻二级菜单li> li>新闻二级菜单li> li>新闻二级菜单...li>选择器.lt(num):用于选中下标小于指定下标的所有jQuery对象li> li>选择所有的子元素: 选择器.children()li>...li>选择所有的指定的子元素: 选择器.children("ul")li> li>选择第一个子元素:选择器.first()li> li>选择最后一个子元素.../li> li>二次筛选:父选择器.find(子选择器),从父选择器选中的标签中的子元素里面,查询符合子选择器的标签元素li> li>next...:选择下一个同级元素li> li>prev:选择上一个同级元素li> li>sibings:选择所有的同级元素li> </
选择器 jquery用法思想一 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功。...$('#box').siblings(); //选择id是box的元素的同级元素 $('#box').find('.myClass'); //选择id是box的元素内的class等于myClass的元素...判断是否选择到了元素 jquery有容错机制,即使没有找到元素,也不会出错,可以用length属性来判断是否找到了元素,length等于0,就是没选择到元素,length大于0,就是选择到了元素...() 鼠标离开(离开子元素也触发) mouseenter() 鼠标进入(进入子元素不触发) mouseleave() 鼠标离开(离开子元素不触发) hover() 同时为mouseenter和mouseleave...事件冒泡的作用 事件冒泡允许多个操作被集中处理(把事件处理器添加到一个父级元素上,避免把事件处理器添加到多个子级元素上),它还可以让你在对象层的不同级别捕获事件。
jQuery对象内部有3个元素。 下标为0的元素表示其内部的DOM对象,即document对象。 length表示其内部DOM对象的个数,一个jQuery对象中可以包装多个DOM对象。...$(".box >.con") 选取class名为box下的所有class名为con的子元素(一级) prev + next 获取当前元素紧邻的一下同级元素 $("div + .title")获取紧邻...的下一个class名为title的兄弟节点 prev~siblings 获取当前元素后的所有同级元素 $(".bar ~ li")获取class名为bar的元素后的所有同级元素节点li>...取得一个包含所有匹配元素的唯一父元素的元素集合 siblings([expr]) 获取所有同级元素(不分上下) next([expr]) 匹配紧邻的同级的下一个元素 prev([expr]) 匹配紧邻的同级的上一个元素...7.3 jQuery UI jQuery UI是在jQuery基础上新增的一个库。 特点: 拥有强大的可扩展功能,具有吸引人的漂亮页面,能够更轻松地在网页中添加专业级的UI元素。
/* 子子菜单项 */ .st_tree ul ul ul li a{ font-size: 16px; } /* 子菜单项 */ .st_tree ul ul li{ padding-left..._init=function(){ this.tree.find("ul ul").hide(); /* 隐藏所有子级菜单 */...this.tree.find("ul ul[show='true']").show(); /* 显示 show 属性为 true 的子级菜单 */ }/* option....("folder"); /* 设置节点“是否包含子节点”属性 */ this.find("li").attr("hasChild",false);...this.find("li").find("a").attr("hasChild",false); this.find("ul").prev("li").attr("hasChild
jquery用法思想 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功。...$('#myId') //选择id为myId的网页元素 $('.myClass') // 选择class为myClass的元素 $('li') //选择所有的li元素 $('#ul1 li span')...('div').nextAll(); //选择div元素后面所有的同辈元素 $('div').parent(); //选择div的父元素 $('div').children(); //选择div的所有子元素...$('div').siblings(); //选择div的同级元素 $('div').find('.myClass'); //选择div内的class等于myClass的元素 $('div').prev...判断是否选择到了元素 jquery有容错机制,即使没有找到元素,也不会出错,可以用length属性来判断是否找到了元素,length等于0,就是没选择到元素,length大于0,就是选择到了元素。
js控制json生成菜单——自制菜单(一) 此文档解决以下问题: 1.JSON文件的书写方式 2.jQuery.getJSON()的运用 3.jQuery.each()的运用 4.jQuery的DOM...>"); //7.页面首次加载时,只有第一项一级菜单的子菜单显示 //其他子菜单项隐藏...(); //6.为一级菜单绑定点击事件 //一级菜单项可以滑动显示或隐藏子菜单项...//根据该对象的父级菜单id找li标签,成为其子菜单项 $("." + data[i]["navParentId"])....find("ul").append("li class='" + data[i]["navId"] + "'>" + data[
p'); // 返回所有节点 ps.length; // 数一数页面有多少个节点 按class查找 var a = $('.red'); // 所有节点包含`class="red"`都将返回...="lang-lua">Luali> $('.lang .lang-javascript').css("color","red") jQuery 特殊选择器...查找子父节点 $('h3').parent().css() //查找h3父元素 $('h3').sliblings()//所有兄弟节点 $('h3').nextAll()//当前节点后面所有兄弟节点 $...$('div').find('li')//所有后代元素 操作DOM 修改Text和HTML jQuery对象的text()和html()方法分别获取节点的文本和原始HTML文本 无参数调用text(...');//当前li之后的所有li变为灰色 }) nextAll() 方法返回被选元素之后的所有同级元素。
***事件冒泡 现象:父子级标签 触发子级的事件,这个事件会逐层向父级传递。 子集执行了某一事件,会逐层向上触发相同事件,直到被处理或者遇到return。...比如子级有单击事件,那么父级如果有单击事件也会被触发,父级的父级如果有单击事件也会被触发。 任何一个操作,计算机或者浏览器都会去处理。不管你有没有设置对应的事件。...(父:最近的能包含住将来发生事件的所有子级)------ 事件代理 .delegate(真实发生事件的目标,字符串事件属性,匿名函数去写命令function(){}) 工作中有可能会有人用这个词on()...新增节点------- 步骤: 1、声明变量保存节点数据(名字一般为$开头,然后找的标签是什么就叫做什么) 2、使用追加函数将节点变量追加到指定位置 子级加: append(添加的内容) 向末尾加 appendTo...(目的地) prepend()向前面加 prependTo(目的地) 父级加: after()在同级的后面加 insertAfter(目的地)在同级的后面加 before()在同级别的前面加 insertBefore
> 相邻选择器: 在所有匹配的元素后选择同级别相邻元素,如下匹配所有跟在.outer后面的所有P标签,并设置成红色.... 兄弟选择器: 兄弟选择器就是在所有匹配的元素后选择同级的所有元素,如下匹配.outer类后面的所有同级DIV标签....var count = $(".MyClass ul li:even"); document.write("基数标签个数: " + count.length + "");...var count = $(".MyClass ul li:odd"); document.write("偶数标签个数: " + count.length); ...,以下在类名为"MyForm"盒子里,找所有div子标签,并将其设置为绿色.
("标签名") $(this)就是将这个dom对象转换成jquery对象,就可以对这个对象进行操作; 可以查找当前元素下的子元素; html //当鼠标访问指定的li时,指定的li下的p标签显示,鼠标移除后...$(this).find("p").css({"display":"none"}); //查找到当前元素的子元素 }); //还可以是使用:hidden 和 :visible 可见选择器 $(..."#play ol li").mouseover(function(){ $(this).find("p:hidden").show(); }); $("#play ol li").mouseleave...方法 说明 $(this).find("标签名") 当前标签下的指定标签 $(this).index() 当前标签的下标 3、jQuery基本操作 3.1 样式操作 方法(已声明好的外部样式类名,多个使用空格分割...); alert($(elm).html()); }); $("li").each(function(){ //注意:elm时dom元素对象,不可以直接使用jQuery方法,必须是转化为jQuery
) 鼠标进入(进入子元素也触发) mouseout() 鼠标离开(离开子元素也触发) mouseenter() 鼠标进入(进入子元素不触发) mouseleave() 鼠标离开(离开子元素不触发) hover...,避免把事件处理器添加到多个子级元素上),它还可以让你在对象层的不同级别捕获事件。...’).on(事件属性,匿名函数)) DOM操作(节点操作) DOM: 网页文档的根/根标签 追加节点:同级追加和自己追加(前面 后面) 步骤: 声明变量保存的节点数据 使用追加函数追加节点 子级追加:...和 子级追加 (前面 后面) // 步骤:1、声明变量保存节点数据;2、使用追加函数追加节点 var $li = $('li>2222li>')...// ul子级追加 // $li.appendTo($('ul')) //结尾追加 // $('ul').append($li) // $li.prependTo
近期jquery的学习经历了一些反复:开始时觉得非常强大,比js好用,和css关系密切,一句话:完美。等到把《锋利的JQuery》看完,又有点不知道用它来干嘛了。...一级菜单的图标形如tb0.jpg,tb1.jpg…;二级的形如tb00.jpg,tb01.jpg… 展开菜单后则自动将同级的其他菜单折叠,节省空间 自定义图标大小,缩进距离,三级菜单字体大小等 初始化时展开指定的菜单...="#">子菜单功能1li> li>子菜单功能2li> li>子菜单功能3li... li> li>子菜单功能2li> li>子菜单功能3li>...="#">子菜单功能1li> li>子菜单功能2li> li>子菜单功能3li
领取专属 10元无门槛券
手把手带您无忧上云