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 相关文章推荐
15款优秀的jQuery导航菜单插件分享
Jul 19 Javascript
javascript中input中readonly和disabled区别介绍
Oct 23 Javascript
JS 获取浏览器和屏幕宽高等信息的实现思路及代码
Jul 31 Javascript
js动态设置鼠标事件示例代码
Oct 30 Javascript
js对象内部访问this修饰的成员函数示例
Apr 27 Javascript
AngularJs bootstrap详解及示例代码
Sep 01 Javascript
JS完成画圆圈的小球
Mar 07 Javascript
jQuery使用eraser.js插件实现擦除、刮刮卡效果的方法【附eraser.js下载】
Apr 28 jQuery
vue select组件的使用与禁用实现代码
Apr 10 Javascript
layui(1.0.9)文件上传upload,前后端的实例代码
Sep 26 Javascript
vue axios请求成功却进入catch的原因分析
Sep 08 Javascript
Node.js fs模块原理及常见用途
Oct 22 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新手上路(十一)
2006/10/09 PHP
php调用mysql存储过程
2007/02/14 PHP
PHP随机生成唯一HASH值自定义函数
2015/04/20 PHP
PHP封装curl的调用接口及常用函数详解
2018/05/31 PHP
dtree 网页树状菜单及传递对象集合到js内,动态生成节点
2012/04/14 Javascript
javascript 动态修改css样式方法汇总(四种方法)
2015/08/27 Javascript
AngularJS extend用法详解及实例代码
2016/11/15 Javascript
基于JS实现仿百度百家主页的轮播图效果
2017/03/06 Javascript
Vue+SpringBoot开发V部落博客管理平台
2017/12/27 Javascript
搭建element-ui的Vue前端工程操作实例
2018/02/23 Javascript
JS实现的贪吃蛇游戏完整实例
2019/01/18 Javascript
微信小程序获取用户信息的两种方法wx.getUserInfo与open-data实例分析
2019/05/03 Javascript
js打开word文档预览操作示例【不是下载】
2019/05/23 Javascript
VUE项目中加载已保存的笔记实例方法
2019/09/14 Javascript
Javascript Web Worker使用过程解析
2020/03/16 Javascript
在vant中使用时间选择器和popup弹出层的操作
2020/11/04 Javascript
vue mvvm数据响应实现
2020/11/11 Javascript
Python3控制路由器——使用requests重启极路由.py
2016/05/11 Python
python数据结构之列表和元组的详解
2017/09/23 Python
Sublime开发python程序的示例代码
2018/01/24 Python
Python smtplib实现发送邮件功能
2018/05/22 Python
使用python采集脚本之家电子书资源并自动下载到本地的实例脚本
2018/10/23 Python
Pandas中DataFrame的分组/分割/合并的实现
2019/07/16 Python
Python测试线程应用程序过程解析
2019/12/31 Python
tensorflow 分类损失函数使用小记
2020/02/18 Python
pyecharts在数据可视化中的应用详解
2020/06/08 Python
django rest framework 过滤时间操作
2020/07/12 Python
css3中的calc函数浅析
2018/07/10 HTML / CSS
html5借用repeating-linear-gradient实现一把刻度尺(ruler)
2019/09/09 HTML / CSS
外贸业务员岗位职责
2013/11/24 职场文书
热爱祖国演讲稿
2014/05/04 职场文书
师德师风承诺书
2014/05/23 职场文书
2015年元旦晚会活动总结(学生会)
2014/11/28 职场文书
国家助学金感谢信
2015/01/21 职场文书
个人售房合同协议书
2016/03/21 职场文书
Python实现生活常识解答机器人
2021/06/28 Python