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 相关文章推荐
jquery创建并行对象或者合并对象的实现代码
Oct 10 Javascript
原生js实现淘宝购物车功能
Jun 23 Javascript
JavaScript创建对象的七种方式(推荐)
Jun 26 Javascript
javascript如何用递归写一个简单的树形结构示例
Sep 06 Javascript
jQuery中常用动画效果函数知识点整理
Aug 19 jQuery
vue左侧菜单,树形图递归实现代码
Aug 24 Javascript
vue实现点击选中,其他的不选中方法
Sep 05 Javascript
Webpack 4如何动态切割JS注入文件名详解
Jul 09 Javascript
微信小程序实现时间进度条功能
Nov 17 Javascript
node实现mock-plugin中间件的方法
Dec 25 Javascript
JavaScript享元模式原理与用法实例详解
Mar 09 Javascript
js实现Element中input组件的部分功能并封装成组件(实例代码)
Mar 02 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 超链接 抓取实现代码
2009/06/29 PHP
通过php添加xml文档内容的方法
2015/01/23 PHP
PHP MYSQL简易交互式站点开发
2016/12/27 PHP
php利用ZipArchive类操作文件的实例
2020/01/21 PHP
PHP代码加密的方法总结
2020/03/13 PHP
javascript中取前n天日期的两种方法分享
2014/01/26 Javascript
JavaScript实现的内存数据库LokiJS介绍和入门实例
2014/11/17 Javascript
JavaScript静态类型检查工具FLOW简介
2015/01/06 Javascript
jQuery DOM插入节点操作指南
2015/03/03 Javascript
基于JavaScript如何实现ajax调用后台定义的方法
2015/12/29 Javascript
javascript对象的创建和访问
2016/03/08 Javascript
基于JS实现textarea中获取动态剩余字数的方法
2016/05/25 Javascript
TinyMCE汉化及本地上传图片功能实例详解
2016/05/31 Javascript
微信小程序 石头剪刀布实例代码
2017/01/04 Javascript
angular4 获取wifi列表中文显示乱码问题的解决
2018/10/20 Javascript
jQuery+PHP实现上传裁剪图片
2020/06/29 jQuery
浅谈vue后台管理系统权限控制思考与实践
2018/12/19 Javascript
vue使用高德地图根据坐标定位点的实现代码
2019/08/22 Javascript
JavaScript定时器使用方法详解
2020/03/26 Javascript
vue中父子组件的参数传递和应用示例
2021/01/04 Vue.js
[00:17]天涯墨客一技能展示
2018/08/25 DOTA
Python的Flask开发框架简单上手笔记
2015/11/16 Python
Python SqlAlchemy动态添加数据表字段实例解析
2018/02/07 Python
python实现数据写入excel表格
2018/03/25 Python
在Pycharm中自动添加时间日期作者等信息的方法
2019/01/16 Python
python爬取”顶点小说网“《纯阳剑尊》的示例代码
2020/10/16 Python
python爬虫如何解决图片验证码
2021/02/14 Python
浅谈pc和移动端的响应式的使用
2019/01/03 HTML / CSS
HTML5未来发展趋势
2016/02/01 HTML / CSS
纽约手袋品牌:KARA
2018/03/18 全球购物
现代生活方式的家具和装饰:Dot & Bo
2018/12/26 全球购物
Java的接口和C++的虚类的相同和不同处
2014/03/27 面试题
三好学生评语大全
2014/12/29 职场文书
委托书格式要求
2015/01/28 职场文书
幼儿园个人总结
2015/02/28 职场文书
公务员学习中国梦心得体会
2016/01/05 职场文书