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 相关文章推荐
iframe的父子窗口之间的对象相互调用基本用法
Sep 03 Javascript
JavaScript中实现sprintf、printf函数
Jan 27 Javascript
封装了jQuery的Ajax请求全局配置
Feb 05 Javascript
纯javascript实现分页(两种方法)
Aug 26 Javascript
javascript下拉列表菜单的实现方法
Nov 18 Javascript
不想让浏览器运行javascript脚本的方法
Nov 20 Javascript
jQuery的Read()方法代替原生JS详解
Nov 08 Javascript
鼠标拖动改变DIV等网页元素的大小的实现方法
Jul 06 Javascript
jQuery选择器之基本选择器用法实例分析
Feb 19 jQuery
使用taro开发微信小程序遇到的坑总结
Apr 08 Javascript
基于ts的动态接口数据配置的详解
Dec 18 Javascript
vue - props 声明数组和对象操作
Jul 30 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
ThinkPHP 连接Oracle数据库的详细教程[全]
2012/07/16 PHP
cakephp打印sql语句的方法
2015/02/13 PHP
PHP的Yii框架中YiiBase入口类的扩展写法示例
2016/03/17 PHP
PHP+MySql实现一个简单的留言板
2020/07/19 PHP
如何使用Javascript正则表达式来格式化XML内容
2013/07/04 Javascript
购物车选中得到价格实现示例
2014/01/26 Javascript
node.js中的fs.writeFileSync方法使用说明
2014/12/14 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
jQuery Mobile 和 Kendo UI 的比较
2016/05/05 Javascript
sencha ext js 6 快速入门(必看)
2016/06/01 Javascript
深入理解JS正则表达式---分组
2016/07/18 Javascript
js判断所有表单项不为空则提交表单的实现方法
2016/09/09 Javascript
jQuery UI 实例讲解 - 日期选择器(Datepicker)
2017/09/18 jQuery
JS实现同一DOM元素上onClick事件与onDblClick事件并存的解决方法
2018/06/07 Javascript
vue分页插件的使用方法
2019/12/25 Javascript
Vue+tracking.js 实现前端人脸检测功能
2020/04/16 Javascript
解决echarts中横坐标值显示不全(自动隐藏)问题
2020/07/20 Javascript
element-plus一个vue3.xUI框架(element-ui的3.x 版初体验)
2020/12/02 Vue.js
javascript实现倒计时关闭广告
2021/02/09 Javascript
[04:11]2014DOTA2国际邀请赛 CIS遗憾出局梦想不灭
2014/07/09 DOTA
[51:10]VP vs VGJ.S 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
Python实现excel转sqlite的方法
2017/07/17 Python
TensorFlow实现打印每一层的输出
2020/01/21 Python
Python如何批量获取文件夹的大小并保存
2020/03/31 Python
Python pexpect模块及shell脚本except原理解析
2020/08/03 Python
德国最大的服装、鞋子和配件在线商店之一:Outfits24
2019/07/23 全球购物
商务英语应届生自我鉴定
2013/12/08 职场文书
家长会学生家长演讲稿
2013/12/29 职场文书
称象教学反思
2014/02/03 职场文书
少先队入队活动方案
2014/02/08 职场文书
就业协议书范本
2014/04/11 职场文书
护士长2014年度工作总结
2014/11/11 职场文书
公务员年度考核登记表个人总结
2015/02/12 职场文书
2015庆祝七一建党节94周年活动总结
2015/03/20 职场文书
新农村建设指导员工作总结
2015/08/13 职场文书
python使用pygame创建精灵Sprite
2021/04/06 Python