对li标签的相关操作——8种方式获取li标签的第一个元素的内容

1、alert($("ul>li").first().html());
2、alert($('ul>li').eq(0).html());
3、alert($('ul>li:nth-child(1)').html());
4、alert($('ul').children()[0].innerHTML);
5、alert($('ul>li')[0].innerHTML);
6、alert($('ul').find("li")[0].innerHTML);
7、alert($('ul').contents().filter("li")[0].innerHTML);
8、alert($("ul>li").get(0).innerHTML);

注:contents() 方法获得匹配元素集合中每个元素的子节点,包括文本和注释节点。

filter() 方法将匹配元素集合缩减为匹配指定选择器的元素。

.contents() 和 .children() 方法类似,不同的是前者在结果 jQuery 对象中包含了文本节点以及 HTML 元素

在这里我们不可直接用$('ul').contents()需使用$('ul').contents().filter("li")

前端学习笔记(zepto或jquery)——对li标签的相关操作(二)的更多相关文章

  1. 前端学习笔记(zepto或jquery)——对li标签的相关操作(五)

    对li标签的相关操作——has与find的差异性 demo代码: <ul> <li><p>1</p></li> <li>2< ...

  2. 前端学习笔记(zepto或jquery)——对li标签的相关操作(四)

    对li标签的相关操作——五种方式给奇数项li标签设置样式 demo演示: 1 2 3 4 5 6 7 // 详解: 通常我们为多个li添加样式时常用的是使用filter,但我们在第三节中可以看到fil ...

  3. 前端学习笔记(zepto或jquery)——对li标签的相关操作(三)

    对li标签的相关操作——八种方式遍历li标签并获取其值 $("ul>li").forEach(function(item,index){ alert(index+" ...

  4. 前端学习笔记(zepto或jquery)——对li标签的相关操作(一)

    对li标签的相关操作——点击li标签进行样式切换的两种方式 Demo演示: 1 2 3 4 // 详解: 第一种方式(以ul为基础): $("ul").bind("cli ...

  5. 前端学习笔记之HTML body内常用标签

    阅读目录 一 HTML语义化 二 字符实体 三 h系列标签 四 p标签 五 img标签 六 a标签 七 列表标签 八 table标签 九 form标签 一 HTML语义化 body中的标签是会显示到浏 ...

  6. .net学习笔记----利用System.Drawing.Image类进行图片相关操作

    C#中对图片的操作主要是通过System.Drawing.Image等类进行. 一.将图片转换为字节流 /// <summary> /// 图片处理帮助类 /// </summary ...

  7. 【前端】Web前端学习笔记【1】

    ... [2015.12.02-2016.02.22]期间的学习笔记. 相关博客: Web前端学习笔记[2] 1. JS中的: (1)continue 语句 (带有或不带标签引用)只能用在循环中. ( ...

  8. Web前端学习笔记(001)

    ....编号    ........类别    ............条目  ................明细....................时间 一.Web前端学习笔记         ...

  9. 【前端】Web前端学习笔记【2】

    [2016.02.22至今]的学习笔记. 相关博客: Web前端学习笔记[1] 1. this在 JavaScript 中主要有以下五种使用场景 在全局函数调用中,this 绑定全局对象,浏览器环境全 ...

随机推荐

  1. [LeetCode235]Lowest Common Ancestor of a Binary Search Tree

    题目: Given a binary search tree (BST), find the lowest common ancestor (LCA) of two given nodes in th ...

  2. 【转】static_cast和reinterpret_cast

    static_cast和reinterpret_cast揭秘 收藏 本文讨论static_cast<> 和 reinterpret_cast<>. reinterpret_ca ...

  3. iOS pragma mark要使用

    郝萌主倾心贡献,尊重作者的劳动成果.请勿转载. 假设文章对您有所帮助.欢迎给作者捐赠.支持郝萌主,捐赠数额任意.重在心意^_^ 我要捐赠: 点击捐赠 Cocos2d-X源代码下载:点我传送 简单的来说 ...

  4. IOS基金会_ UICollectionView简单易用

    和表格视图类似 UICollectionView的使用有两种方法 一种是继承UICollectionViewController,这个Controller会自带一个UICollectionView. ...

  5. 采用curl库

    Windows通过使用curl库: 到http://curl.haxx.se/下了个curl的源代码下来,源代码是用VC6编译的,我在VS2005下又一次进行编译.竟然仅仅有一个警告. cUrl的实现 ...

  6. jquery经常使用事件(整理)

    Jquery事件 (一).事件列表. 1.blur() 当失去焦点时触发.包含鼠标点击离开和TAB键离开. 2.change() 当元素获取焦点后,值改变失去焦点事触发. 3.click() 当鼠标单 ...

  7. java注意事项演示 地图产生表 演示样本 来自thinking in java 4 20代码的章

    java注意事项演示 地图产生表 演示样本  来自thinking in java 4 20代码的章 thinking in java 4免费下载:http://download.csdn.net/d ...

  8. CSDN个人空间能再烂吗?

    CSDN空间你敢再烂么? 从CSDN博客跳转到CSDN个人空间的入口还算明显,可是想从个人空间跳转到博客,可真是众里寻他千百度.跳转接口怎么寻都寻不到.根本没有这个跳转的入口.唯一的途径仅仅能从写博文 ...

  9. Data URI(转)

    Data URL 早在 1995 年就被提出,那个时候有很多个版本的 Data URL Schema 定义陆续出现在 VRML 之中,随后不久,其中的一个版本被提上了议案——将它做个一个嵌入式的资源放 ...

  10. hibernate Disabling contextual LOB creation as connection was null

    使用hibernate通路sybase当遇到异常. Could not obtain connection metadata : ASE is now using a multi-byte c ...