使用jquery获取ul里面的所有li - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

jQuery

jQuery 对DOM的原生方法进行了封装，jQuery 对象只能使用 jQuery 方法，DOM 对象则使用原生的 JavaScirpt 属性和方法。...所以，jQuery 只是对js常用属性和方法进行了封装。 DOM使用原生js方法和属性，jQuery 使用jQuery 属性和方法。...例如：给UL里的很多LI都设置成红色字体直接$(“ul li”).css(“color”, “red”);//隐式迭代自动遍历每一个LI。...$(“ul”).empty(); 结果：清空ul里所有的li；.html(‘’’’);与其类似 ---- jQuery 尺寸、位置操作 jQuery 尺寸参数为空时是取值，参数不为空是设置宽高；...（也可以把绑定事件的on()改为one()表示事件只触发一次） $("p").off(); // 解绑p元素所有事件处理程序 $("p").off( "click"); // 解绑p元素上面的点击事件

23K5 0

ajax使用案例

network->all代表加载的所有事件后面的那个显示有/，这个是首路由。...url在变，这个接口也在变，数据也在变上图和下图那栏数据一致：点击运维获取的是sub_categroy是0和2的数据，0是所有的数据，2是运维的接口数据 free_sections里的属性和页面中显示的一致...而想要实现ajax的请求是放在.ajax({})里面的。ajax是jQuery的方法，需要导入jQuery库文件。刚才犯了个错误，没有放到下面就是代码执行后获取到的这个api的数据对象。...；这里做的是对每个元素做添加li标签并追加到id是box下的ul中，显示返回数据中所有的name并记录是哪条数据的（通过id区分）。...这样就能显示出全部的下面的内容。然后将第二个ajax的请求api使用拼接的url，因为拼接用了变量，‘’变成反引号。这里sub_category是0.获取到全部内容。

12.3K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

jQuery基础与JavaScript与CSS交互-第五章

* $(‘*’)选取所有的元素层次选择器 $(‘div span’)：选取里所有的元素 $(‘div > span’)：选取下元素名是的子元素 $(...‘.one + div’)：class为one的下一个元素 $(‘#two ~ div’)：id为two的元素后面的所有兄弟元素过滤选择器语法特点是使用“:” 分类如下：...li:last" )：选取所有li>元素中的最后一个li>元素 $(" li:even" )：选取索引为偶数的所有li>元素 $(" li:odd" )：选取索引为奇数的所有li>元素 $("...li:not(.three)" )：选取class不是three的元素 $(":header" )：选取网页中所有标题元素 $(":focus" )：选取当前获取焦点的元素 $("li:eq(1)"...li>JavaScript高级编程li> li>JQuery权威指南li> li>JQuery实战li> ul> <script

1.2K3 0

Jquery attr()方法属性赋值和属性获取

1.attr(name)//获取属性的值 1.1使用attr(name)获取title值： alert($("ul li:eq(1)"... 4.attr(properties) //将一个“名/值”形式的对象设置为所有匹配元素的属性 4.1获取ul>里第2个li>设置title和alt属性。 ?...4.2获取ul>里第2个li>设置class。 $("ul li:eq(1)").attr({className:"lili"}); 结果： ?...ul>里第2个li>设置id。...ul>里第2个li>设置style。

11.4K4 0

Web前端基础（07）

/imgs/1.jpg'>"); }) //修改元素样式 $("ul").css("color","red"); //获取元素样式 //alert($("ul").css(...> li>赵云li> li>关羽li> li>百里玄策li> ul> li> li>女友们 ul> li..."> //先把所有二层ul隐藏 $("li>ul").hide(); //给第一层的所有li添加点击事件 $("body>ul>li").click(function(){...//在事件方法中this代表触发该事件的元素对象 //this是js对象如果需要使用jq中的方法需要将 //js对象转成jq对象$(this) //得到点击li里面的子元素ul...$(this).children().toggle(); //得到其他两个li里面的ul并且设置隐藏 $(this).siblings().children().hide();

5.8K2 0

锋利的jQuery系列

在页面中引入jQuery，在编写的页面代码中标签内引入jQuery库后，就可以使用jQuery库了，下面是第一个jQuery程序： ul{ overflow:hidden;} .menu li ul.level2{ display:none;} .menu li ul.level2 li a{ display: block;...jQuery对象时jQuery独有的。如果一个对象时jQuery对象，那么就可以使用jQuery里的语法。例如： //获取id为foo的元素内html代码。...$("#foo").html(); //这段代码等价于： document.getElmentById("foo").innerHTML; 在jQuery对象中无法使用DOM对象的任何方法，同样ＤＯＭ对象也不能使用...jQuery里的方法。

9232 0

jQuery

jQuery 对象是经过包装的dom对象（伪数组形式存储） jQuery对象才能使用jQuery方法,不能混用 1.1.4 jQuery对象和Dom对象转换 // DOM对象转换成jQuery对象...’*"’) 匹配所有元素类选择器 $(".class") 获取同一类class的元素标签选择器 $(“div”) 获取同一类标签的所有元素并集选择器 $(“div,p,li”) 选取多个元素交集选择器...$s(“Ii.current”) 交集元素 2.1.2 层级选择器名称用法描述子代选择器 $(“ul>li”); 使用>号，获取亲儿子层级的元素;注意，并不会获取孙子层级的元素后代选择器...$(“ul li”); 使用空格，代表后代选择器，获取ul下的所有li元素，包括孙子等 2.1.3 筛选选择器名称用法描述 :first $(‘li:first’) 获取第一个li元素 :last...$('ul').empty();//相当于清空ul里的内容通过html来清空 $('ul').html(); 4.4 尺寸，位置操作 4.4.1 jQuery尺寸操作语法用法 width() /

10.2K1 0

从零开始学 Web 之 jQuery（二）获取和操作元素的属性

一、jQuery获取和操作元素属性 DOM中有很多方式获取元素，比如通过id，通过标签名，通过类名，通过name的值，通过选择器等方式。...PS：jQuery 中使用 jQuery对象.val("内容") 来设置表单标签的 value 属性。...2、 $("p") 是获取所有的 p 标签，然后全部设置文本内容，我们并没有循环设置，但是全部的 p 标签的文本内容都改变了，这是 jQuery 内部自动循环了，这就是隐式迭代。...PS：jQuery中使用 jQuery对象.css("属性":"值"); 的方式设置标签的样式。 4、并集选择器语法：$("div,p,span")，中间使用逗号隔开。...语法：$("div ul span") 选择 div 下面所有 ul 下的所有的 span 标签，不包括 div 下面的 span，必须在 ul 里面。

2.3K4 0

学习jQuery这一篇就够了

目前超过 90% 的网站都使用了 jQuery 库，jQuery 的宗旨：写的更少，做得更多！.../libs/jquery/1.9.1/jquery.min.js"> # 1.5 jQuery 快速使用 jQuery 数据需求描述：将 ul 列表下所有的 p 子节点全部移除 ul> li>列表项1li> 我是段落1 li...li>列表项3li> 我是段落2 ul> console.log($('#two').prev()[0]); # 4. prevAll() 方法描述：获得集合中每个匹配元素的所有前面的兄弟元素...li>列表项3li> 我是段落2 ul> console.log($('#two').next()[0]); # 6. nextAll() 方法描述：获得集合中每个匹配元素的所有后面的兄弟元素

3.5K5 0

JQuery 入门 - 附案例代码

到底是什么 jQuery的官网 http://jquery.com/ jQuery就是一个js库，使用jQuery的话，会比使用JavaScript更简单。...jQuery对象：jquery对象就是使用jquery的方法获取页面中的元素返回的对象就是jQuery对象。...对象 jQuery对象转换成DOM对象： var $li = $("li"); //第一种方法（推荐使用） $li[0] //第二种方法 $li.get(0) jquery选择器什么是jQuery选择器...基本选择器名称用法描述 ID选择器 $(“#id”); 获取指定ID的元素类选择器 $(“.class”); 获取同一类class的元素标签选择器 $(“div”); 获取同一类标签的所有元素...层级选择器名称用法描述子代选择器 $(“ul>li”); 使用>号，获取儿子层级的元素，注意，并不会获取孙子层级的元素后代选择器 $(“ul li”); 使用空格，代表后代选择器，获取ul下的所有

15K1 0

「jQuery」基础 - 01

j 就是 JavaScript； Query 查询；意思就是查询js，把js中的DOM操作做了封装，我们可以快速的查询使用里面的功能。...更推荐使用第一种方式。 1.2.4. jQuery中的顶级对象$ 是 jQuery 的别称，在代码中可以使用 jQuery 代替，但一般为了方便，通常都直接使用。...jQuery 对象和 DOM 对象使用 jQuery 方法和原生JS获取的元素是不一样的，总结如下 : 用原生 JS 获取来的对象就是 DOM 对象 jQuery 方法获取的元素就是 jQuery 对象...因为原生js 比 jQuery 更大，原生的一些属性和方法 jQuery没有给我们封装，要想使用这些属性和方法需要把jQuery对象转换为DOM对象才能使用。...1.3. jQuery 选择器原生 JS 获取元素方式很多，很杂，而且兼容性情况不一致，因此 jQuery 给我们做了封装，使获取元素统一标准。 1.3.1.

8.2K2 1

前端成神之路-01_jQuery

j 就是 JavaScript； Query 查询；意思就是查询js，把js中的DOM操作做了封装，我们可以快速的查询使用里面的功能。...更推荐使用第一种方式。 1.2.4. jQuery中的顶级对象$ 是 jQuery 的别称，在代码中可以使用 jQuery 代替，但一般为了方便，通常都直接使用。...1.2.5. jQuery 对象和 DOM 对象使用 jQuery 方法和原生JS获取的元素是不一样的，总结如下 : 用原生 JS 获取来的对象就是 DOM 对象 jQuery 方法获取的元素就是...1.3. jQuery 选择器原生 JS 获取元素方式很多，很杂，而且兼容性情况不一致，因此 jQuery 给我们做了封装，使获取元素统一标准。 1.3.1....> li>我是ul 的li> li>我是ul 的li> li>我是ul 的li> ul> <script

13.2K1 0

尚能饭否｜技术越来越新，我对老朋友jQuery还是一如既往热爱

jar包\jQuery 4、jQuery选择器「分类：」基本选择器、层次选择器、过滤选择器（表单选择器）「基本选择器：」基本选择器是jQuery中使用最频繁的选择器，它由元素...根据祖先元素匹配所有的后代元素 parent＞child 根据父元素匹配所有的子元素 prev+next 匹配prev后的相邻元素 prev～siblings 匹配prev后面的所有兄弟元素.../img/close.gif"/> ul> li> JavaEE其他 (3230) li> ul> 简化 jQuery无法使用DOM对象的任何方法，同理DOM对象也不能使用jQuery里的方法「具体转换：」 jQuery和DOM对象互转 DOM转换成jQuery var username = document.getElementById

1K5 0

Javascipt异步与同步

但是这样一来,如果某个任务的执行时间很久,那么后面的所有任务都要去等着前面任务执行完毕。可能会出现浏览器卡死。作为浏览器语言,Javascript的主要用途是与用户互动,以及操作DOM。...id为con的添加点击事件,这种情况下肯定是会报错了,原因是jquery-ajax默认是异步的,哪这种情况下当执行到获取dom元素时,是获取不到的,因为ajax的没有执行。...可是这样又会面临一个问题: 阻塞,如果返回的数据量很大的情况下,就会一直等待数据的返回,导致页面的卡顿。哪有没有即是异步又可以获取dom的元素的呢。...我查了下jquery的on的实现,提到了两个关键词事件代理或事件委托。当然上面的事件用的是事件委托。关于事件委托我简单说下: 事件委托就是利用了事件冒泡的原理。...举个栗子: ul id="ul1"> li>111li> li>222li> li>333li> li>444li> ul> window.onload = function

1.2K2 0

jQuery

li> ul> console.log($('#box')) //注意：不管使用任何选择器，获取到的元素都是一个元素集合...+ 注意: 只有 jQuery 的元素集合才可以使用, 原生 DOM 对象不能使用 1. first() => 元素集合里面的第一个 2. last() =...元素集合.nextAll() 获取到当前元素后面的所有兄弟元素 2....元素集合.prevAll() 获取到当前元素上面的所有兄弟元素 2..../jquery/jquery.min.js"> /* jQuery 获取元素尺寸 + 获取元素尺寸有三套方法四种使用方式

2.1K1 0

jQuery的三种$()

div ul')是有区别的， $('div>ul')是的直接后代里找ul>；而$('div ul')是在的所有后代里找ul>。...2）用jQuery对象的几个方法（如方法find()、each()等） $("#orderedlist).find("li")就像 $("#orderedlist li"). each()一样迭代了所有的...不过有一点——$('div>ul')和$('div ul')是有区别的， $('div>ul')是的直接后代里找ul>；而$('div ul')是在的所有后代里找ul>。...而$('#sId li:not(.horizontal)')，就是指类名"sId"里面的所有li的子孙中没有horizontal类的所有元素。...$('ul li')和$('ul[li]')虽然返回的都是一个jQuery数组，但两者的含义正好相反。前者是要找ul>下所有li>子孙，而后者却是在找所有子孙为li>的ul>数组。

1.1K3 0

jQuery 事件注册、事件处理

1. jQuery 事件注册 jQuery 为我们提供了方便的事件注册机制，是开发人员抑郁操作优缺点如下：优点: 操作简单，且不用担心事件覆盖等问题。...身上的，但是触发的对象是 ul 里面的小li // $("ul li").click(); $("ul").on("click", "li", function...li 滑动出来 $(".txt").val(); // 发布后把之前文本框里输入的内容清空 }); // 2.点击的删除按钮，可以删除当前的微博留言li...$("p").off() // 解绑p元素所有事件处理程序 $("p").off( "click") // 解绑p元素上面的点击事件后面的 foo 是侦听函数名 $("ul").off(..."click", "li"); // 解绑事件委托如果有的事件只想触发一次，可以使用 one() 来绑定事件。

5K2 0

jQuery常用的基本选择器

什么是jQuery选择器 jQuery选择器是jQuery为我们提供的一组方法，让我们更加方便的获取到页面中的元素。注意：jQuery选择器返回的是jQuery对象。...jQuery选择器有很多，基本兼容了CSS1到CSS3所有的选择器，并且jQuery还添加了很多更加复杂的选择器。...css里的选择器jQuery都能写基本选择器名称用法描述 ID选择器 $(“#id”) $(“#id”) 获取指定ID的元素类选择器 $(“.class”) 获取同一类class的元素标签选择器...$(“div” 获取同一类标签的所有元素并集选择器 $(“div,p,li”) 使用逗号分隔，只要符合条件之一就可。...">6li> li class="green">7li> li>8li> li>9li> li>10li> ul> <div class="green"

8001 0

Cheeiro的使用

安装 npm install cheerio 特点熟悉的语法：cheerio实现了jQuery的一个子集，去掉了jQuery中所有与DOM不一致或者是用来填浏览器的坑的东西，重现了jQuery...基本的端到端测试显示它的速度至少是JSDOM的8倍极其灵活：cheerio使用了@FB55编写的非常兼容的htmlparser2，因此它可以解析几乎所有的HTML和XML 关于JSDOM cheerio...但是在使用cheerio时我们要手动加载我们的HTML文档首选的方式如下： var cheerio = require('cheerio'), $ = cheerio.load('ul id = "...属性操作（atrributes）用来获取和更改属性的方法： .attr(name, value) 这个方法用来获取和设置属性。获取第一个符合匹配的元素的属性值。...('.apple').next().hasClass('orange') //=> true .prev() 同.next()相反 .siblings() 获取元素集合中第一个元素的所有兄弟元素，不包含它自己

1.6K3 0

jQuery入门前言

jQuery就是一个由JavaScript编写的轻量库，简单的说就是封装了一些JavaScript的操作，所以使用jQuery比使用原生的JavaScript可以达到用更少的代码做更多的事的效果。...对象，再进行操作，而jQuery获取到的$p是jQuery对象。...可以只指定该元素的某个属性，这样所有使用该属性而不管它的值，这个元素都将被定位，也可以更加明确并定位在这些属性上使用特定值的元素，这就是属性选择器展示它们的威力的地方。 ?... baidu //第一种用法(如果有多个p标签，那么其他p标签里的文本内容也能获取到...看案例： ul> li>哈哈li> li>嘻嘻li> ul> $("li").each(function(index, element) {

3.4K3 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭