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 相关文章推荐
javascript实现 在光标处插入指定内容
May 25 Javascript
基于jquery的返回顶部效果(兼容IE6)
Jan 17 Javascript
javascript数组去掉重复
May 12 Javascript
用jquery模仿的a的title属性(兼容ie6/7)
Jan 21 Javascript
JavaScript实现网页图片等比例缩放实现代码及调用方式
Feb 25 Javascript
js string 转 int 注意的问题小结
Aug 15 Javascript
教你如何使用node.js制作代理服务器
Nov 26 Javascript
jQuery获取元素父节点的方法
Jun 21 Javascript
JavaScript实现刷新不重记的倒计时
Aug 10 Javascript
bootstrap导航条实现代码
Dec 28 Javascript
vue倒计时刷新页面不会从头开始的解决方法
Mar 03 Javascript
JavaScript canvas基于数组生成柱状图代码实例
Mar 06 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 json_encode()函数返回json数据实例代码
2014/10/10 PHP
php判断类是否存在函数class_exists用法分析
2014/11/14 PHP
百度工程师讲PHP函数的实现原理及性能分析(一)
2015/05/13 PHP
thinkPHP实现的省市区三级联动功能示例
2017/05/05 PHP
Laravel 手动开关 Eloquent 修改器的操作方法
2019/12/30 PHP
PHP如何通过带尾指针的链表实现'队列'
2020/10/22 PHP
Extjs ajax同步请求时post方式参数发送方式
2009/08/05 Javascript
解析John Resig Simple JavaScript Inheritance代码
2012/12/03 Javascript
JS获取URL中的参数数据
2013/12/05 Javascript
JavaScript+html5 canvas制作色彩斑斓的正方形效果
2016/01/27 Javascript
js判断上传文件后缀名是否合法
2016/01/28 Javascript
利用jquery给指定的table动态添加一行、删除一行的方法
2016/10/12 Javascript
AngularJS操作键值对象类似java的hashmap(填坑小结)
2016/11/12 Javascript
js实现自动轮换选项卡
2017/01/13 Javascript
ajax +NodeJS 实现图片上传实例
2017/06/06 NodeJs
解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题
2018/08/24 Javascript
分享vue里swiper的一些坑
2018/08/30 Javascript
vue-cli打包后本地运行dist文件中的index.html操作
2020/08/12 Javascript
vue使用require.context实现动态注册路由
2020/12/25 Vue.js
Python 异常处理实例详解
2014/03/12 Python
win与linux系统中python requests 安装
2016/12/04 Python
Python实现获取照片拍摄日期并重命名的方法
2017/09/30 Python
python数字图像处理实现直方图与均衡化
2018/05/04 Python
Python直接赋值、浅拷贝与深度拷贝实例分析
2019/06/18 Python
Pandas DataFrame中的tuple元素遍历的实现
2019/10/23 Python
localStorage的过期时间设置的方法详解
2018/11/26 HTML / CSS
蔻驰英国官网:COACH英国
2020/07/19 全球购物
PHP如何防止SQL注入
2014/05/03 面试题
新年晚会主持词
2014/03/24 职场文书
《画杨桃》教学反思
2014/04/13 职场文书
爱国演讲稿500字
2014/05/04 职场文书
煤矿安全生产标语
2014/06/06 职场文书
在校大学生才艺比赛策划书怎么写?
2019/08/26 职场文书
CocosCreator入门教程之网络通信
2021/04/16 Javascript
利用Python多线程实现图片下载器
2022/03/25 Python
Win11电脑显示本地时间与服务器时间不一致怎么解决?
2022/04/05 数码科技