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里嵌入大量字符串常量的实现方法
Jul 07 Javascript
js中iframe调用父页面的方法
Oct 30 Javascript
jQuery中nextAll()方法用法实例
Jan 07 Javascript
Javascript中级语法快速入手
Jul 30 Javascript
JS实现类似51job上的地区选择效果示例
Nov 17 Javascript
Kendo Grid editing 自定义验证报错提示的解决方法
Nov 18 Javascript
vue使用vue-cli快速创建工程
Jul 28 Javascript
vue中使用cropperjs的方法
Mar 01 Javascript
vue动态设置img的src路径实例
Sep 18 Javascript
js判断一个对象是数组(函数)的方法实例
Dec 19 Javascript
jQuery弹框插件使用方法详解
May 26 jQuery
vue+animation实现翻页动画
Jun 29 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-accelerator网站加速PHP缓冲的方法
2008/07/30 PHP
PHP的基本常识小结
2013/07/05 PHP
在Yii2中使用Pjax导致Yii2内联脚本载入失败的原因分析
2016/03/06 PHP
PHP+Session防止表单重复提交的解决方法
2018/04/09 PHP
PHP实现获取url地址中顶级域名的方法示例
2019/06/05 PHP
[JS源码]超长文章自动分页(客户端版)
2007/01/09 Javascript
基于jquery的固定表头和列头的代码
2012/05/03 Javascript
Struts2的s:radio标签使用及用jquery添加change事件
2013/04/08 Javascript
通过JQuery实现win8一样酷炫的动态磁贴效果(示例代码)
2013/07/13 Javascript
基于jquery的9行js轻松实现tab控件示例
2013/10/12 Javascript
jquery实现在页面加载的时自动为日期插件添加当前日期
2014/08/20 Javascript
jQuery实现向下滑出的平滑下拉菜单效果
2015/08/21 Javascript
分享10个优化代码的CSS和JavaScript工具
2016/05/11 Javascript
BootStrap.css 在手机端滑动时右侧出现空白的原因及解决办法
2016/06/07 Javascript
Javascript如何判断数据类型和数组类型
2016/06/22 Javascript
Angular的自定义指令以及实例
2016/12/26 Javascript
jQuery中的deferred使用方法
2017/03/27 jQuery
详解windows下vue-cli及webpack 构建网站(三)使用组件
2017/06/17 Javascript
详解angularjs popup-table 弹出框表格指令
2017/09/20 Javascript
vue基于element的区间选择组件
2018/09/07 Javascript
Vue v-for中的 input 或 select的值发生改变时触发事件操作
2020/08/31 Javascript
[01:31](回顾)杀出重围,决战TI之巅
2014/07/01 DOTA
[06:57]DOTA2-DPC中国联赛 正赛 Ehome vs PSG.LGD 选手采访
2021/03/11 DOTA
Python基础教程之利用期物处理并发
2018/03/29 Python
Python面向对象之类和对象属性的增删改查操作示例
2018/12/14 Python
Python 窗体(tkinter)按钮 位置实例
2019/06/13 Python
tensorboard实现同时显示训练曲线和测试曲线
2020/01/21 Python
python matplotlib模块基本图形绘制方法小结【直线,曲线,直方图,饼图等】
2020/04/26 Python
python查询MySQL将数据写入Excel
2020/10/29 Python
Python 按比例获取样本数据或执行任务的实现代码
2020/12/03 Python
css3如何绘制一个圆圆的loading转圈动画
2018/01/09 HTML / CSS
很酷的小工具和电子产品商城:GearBest
2016/11/19 全球购物
军训的自我鉴定
2013/12/10 职场文书
品牌推广活动策划方案
2014/08/19 职场文书
2015年大学生社会实践评语
2015/03/26 职场文书
步步惊心观后感
2015/06/12 职场文书