jquery 查找新建元素代码


Posted in Javascript onJuly 06, 2010

复习一下
//html
<div class="dv">
<ul>
<li>
<a href="xx.com">xx</a>
</li>
<li>
<a href="aa.com">aa</a>
</li>
<li>
<a href="bb.com">bb</a>
</li>
</ul>
<ul></ul>
</div>
//js
$('.dv').find('ul')->eq(0)->find('li')->each(function(i){
var obj = $(this).find('a')->eq(0);
$em = $('<em>');//新建em元素
$em.html(i);
$em.insertBefore(obj);//把新元素插到查找到的元素前面
});
真方便哈!!!!

关于jQuery的find方法的疑问
find(expr)


搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。

所有搜索都依靠jQuery表达式来完成。这个表达式可以使用CSS1-3的选择器语法来写。


返回值

jQuery


参数

expr (String) :用于查找的表达式


示例

从所有的段落开始,进一步搜索下面的span元素。与$("p span")相同。


HTML 代码:



Hello, how are you?
jQuery 代码:


$("p").find("span")

结果:


[ Hello ]
jquery 查询|jquery 查找元素|jquery 查找对象
#id 返回值:Array<Element>#id
概述
根据给定的ID匹配一个元素。

如果选择器中包含特殊字符,可以用两个斜杠转义。参见示例。

参数
idString
用于搜索的,通过元素的 id 属性中给定的值

示例
描述:
查找 ID 为"myDiv"的元素。

HTML 代码:
<div id="notMe"><p>id="notMe"</p></div>
<div id="myDiv">id="myDiv"</div>jQuery 代码:
$("#myDiv");结果:
[ <div id="myDiv">id="myDiv"</div> ]描述:
查找含有特殊字符的元素

HTML 代码:
<span id="foo:bar"></span>
<span id="foo[bar]"></span>
<span id="foo.bar"></span>jQuery 代码:
#foo\\:bar
#foo\\[bar\\]
#foo\\.barelement 返回值:Array<Element(s)>element概述根据给定的元素名匹配所有元素参数elementString一个用于搜索的元素。指向 DOM 节点的标签名。示例描述:查找一个 DIV 元素。HTML 代码:<div>DIV1</div>
<div>DIV2</div>
<span>SPAN</span>jQuery 代码:$("div");结果:[ <div>DIV1</div>, <div>DIV2</div> ].class返回值:Array<Element(s)>.class概述根据给定的类匹配元素。参数classString一个用以搜索的类。一个元素可以有多个类,只要有一个符合就能被匹配到。示例描述:查找所有类是 "myClass" 的元素.HTML 代码:<div class="notMe">div class="notMe"</div>
<div class="myClass">div class="myClass"</div>
<span class="myClass">span class="myClass"</span>jQuery 代码:$(".myClass");结果:[ <div class="myClass">div class="myClass"</div>, <span class="myClass">span class="myClass"</span> ] selector1,selector2,selectorN返回值:Array<Element(s)>selector1,selector2,selectorN概述将每一个选择器匹配到的元素合并后一起返回。你可以指定任意多个选择器,并将匹配到的元素合并到一个结果内。参数selector1Selector一个有效的选择器selector2Selector另一个有效的选择器selectorN (可选)Selector任意多个有效选择器示例描述:找到匹配任意一个类的元素。HTML 代码:<div>div</div>
<p class="myClass">p class="myClass"</p>
<span>span</span>
<p class="notMyClass">p class="notMyClass"</p>jQuery 代码:$("div,span,p.myClass")结果:[ <div>div</div>, <p class="myClass">p class="myClass"</p>, <span>span</span> ]

Javascript 相关文章推荐
页面图片浮动左右滑动效果的简单实现案例
Feb 10 Javascript
Javascript基础教程之数据类型 (布尔型 Boolean)
Jan 18 Javascript
JS实现的通用表单验证插件完整实例
Aug 20 Javascript
BootStrap智能表单实战系列(十一)级联下拉的支持
Jun 13 Javascript
基于JavaScript实现下拉列表左右移动代码
Feb 07 Javascript
Vue2.0基于vue-cli+webpack同级组件之间的通信教程(推荐)
Sep 14 Javascript
一文让你彻底搞清楚javascript中的require、import与export
Sep 24 Javascript
vuex的使用及持久化state的方式详解
Jan 23 Javascript
Angular2之二级路由详解
Aug 31 Javascript
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 jQuery
node.JS二进制操作模块buffer对象使用方法详解
Feb 06 Javascript
js验证账户名是否重复
May 26 Javascript
jquery 3D球状导航的文章分类
Jul 06 #Javascript
Javascript Function对象扩展之延时执行函数
Jul 06 #Javascript
JavaScript经典效果集锦
Jul 06 #Javascript
前端开发必须知道的JS之原型和继承
Jul 06 #Javascript
基于jQuery的的一个隔行变色,鼠标移动变色的小插件
Jul 06 #Javascript
一个基于jquery的图片切换效果
Jul 06 #Javascript
jQuery ajax BUG:object doesn't support this property or method
Jul 06 #Javascript
You might like
深思 PHP 数组遍历的差异(array_diff 的实现)
2008/03/23 PHP
php iconv() : Detected an illegal character in input string
2010/12/05 PHP
php $_SERVER windows系统与linux系统下的区别说明
2014/02/14 PHP
PHP大转盘中奖概率算法实例
2014/10/21 PHP
编写PHP脚本来实现WordPress中评论分页的功能
2015/12/10 PHP
php 生成加密公钥加密私钥实例详解
2017/06/16 PHP
再次更新!MSClass (Class Of Marquee Scroll通用不间断滚动JS封装类 Ver 1.6)
2007/02/05 Javascript
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
可插入图片的TEXT文本框
2013/12/27 Javascript
JS获取计算机mac地址以及IP的实现方法
2014/01/08 Javascript
JS实现在线统计一个页面内鼠标点击次数的方法
2015/02/28 Javascript
javascript实现图片跟随鼠标移动效果的方法
2015/05/13 Javascript
整理JavaScript创建对象的八种方法
2015/11/03 Javascript
Jquery基础之事件操作详解
2016/06/14 Javascript
jQuery实现select下拉框获取当前选中文本、值、索引
2017/05/08 jQuery
Javascript 实现匿名递归的实例代码
2017/05/25 Javascript
浅谈Vuex的状态管理(全家桶)
2017/11/04 Javascript
VUE2.0+Element-UI+Echarts封装的组件实例
2018/03/02 Javascript
Fundebug支持监控微信小程序HTTP请求错误的方法
2019/02/21 Javascript
Python获取远程文件大小的函数代码分享
2014/05/13 Python
Python赋值语句后逗号的作用分析
2015/06/08 Python
如何用Python合并lmdb文件
2018/07/02 Python
Django的Modelforms用法简介
2019/07/27 Python
Python 3.8正式发布,来尝鲜这些新特性吧
2019/10/15 Python
使用Python爬虫库BeautifulSoup遍历文档树并对标签进行操作详解
2020/01/25 Python
python自动生成证件号的方法示例
2021/01/14 Python
HTML5通过navigator.mediaDevices.getUserMedia调用手机摄像头问题
2020/04/27 HTML / CSS
Html5基于canvas实现电子签名并生成PDF文档
2020/12/07 HTML / CSS
德国最大的拼图在线商店:Puzzle.de
2016/12/17 全球购物
乌克兰机票、铁路和巴士票、酒店搜索、保险:Tickets.ua
2020/01/11 全球购物
小学数学教学经验交流材料
2014/05/22 职场文书
乡镇党的群众路线对照检查材料
2014/09/24 职场文书
2014年村委会工作总结
2014/11/24 职场文书
平安家庭事迹材料
2014/12/20 职场文书
让生命充满爱观后感
2015/06/08 职场文书
详解JAVA的控制语句
2021/11/11 Java/Android