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 String.replace函数参数实例说明
Jun 06 Javascript
jQuery探测位置的提示弹窗(toolTip box)详细解析
Nov 14 Javascript
DOM操作一些常用的属性汇总
Mar 13 Javascript
解析javascript中鼠标滚轮事件
May 26 Javascript
jquery+CSS3模拟Path2.0动画菜单效果代码
Aug 31 Javascript
基于JavaScript如何实现ajax调用后台定义的方法
Dec 29 Javascript
js获取form表单所有数据的简单方法
Aug 18 Javascript
详解angularJs中自定义directive的数据交互
Jan 13 Javascript
vue2 前后端分离项目ajax跨域session问题解决方法
Apr 27 Javascript
JS请求servlet功能示例
Jun 01 Javascript
taro开发微信小程序的实践
May 21 Javascript
Layui Table js 模拟选中checkbox的例子
Sep 03 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
全国FM电台频率大全 - 29 青海省
2020/03/11 无线电
双料怀旧--SHARP GF515的维护、修理和简单调试
2021/03/02 无线电
世界咖啡生产者论坛呼吁:需要立即就咖啡价格采取认真行动
2021/03/06 咖啡文化
URL Rewrite的设置方法
2007/01/02 PHP
php 计划任务 检测用户连接状态
2012/03/29 PHP
探讨捕获php错误信息方法的详解
2013/06/09 PHP
PHP如何通过传引用的思想实现无限分类(代码简单)
2015/10/13 PHP
PHP微信支付实例解析
2016/07/22 PHP
php微信浏览器分享设置以及回调详解
2016/08/01 PHP
CodeIgniter框架验证码类库文件与用法示例
2017/03/18 PHP
Laravel 模型使用软删除-左连接查询-表起别名示例
2019/10/24 PHP
js加强的经典分页实例
2013/03/15 Javascript
极易被忽视的javascript面试题七问七答
2016/02/15 Javascript
批量下载对路网图片并生成html的实现方法
2016/06/07 Javascript
js实现背景图自适应窗口大小
2017/01/10 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
2017/05/11 Javascript
select获取下拉框的值 下拉框默认选中方法
2018/02/28 Javascript
在vue项目中引入高德地图及其UI组件的方法
2018/09/04 Javascript
基于vue-cli、elementUI的Vue超简单入门小例子(推荐)
2019/04/17 Javascript
Python cookbook(数据结构与算法)将序列分解为单独变量的方法
2018/02/13 Python
Python http接口自动化测试框架实现方法示例
2018/12/06 Python
基于python-opencv3的图像显示和保存操作
2019/06/27 Python
python实现的发邮件功能示例
2019/09/11 Python
Python利用全连接神经网络求解MNIST问题详解
2020/01/14 Python
tensorflow 实现数据类型转换
2020/02/17 Python
Spring http服务远程调用实现过程解析
2020/06/11 Python
基于Python实现视频的人脸融合功能
2020/06/12 Python
Selenium webdriver添加cookie实现过程详解
2020/08/12 Python
详解HTML5如何使用可选样式表为网站或应用添加黑暗模式
2020/04/07 HTML / CSS
Linux如何压缩可执行文件
2013/10/21 面试题
金融系应届毕业生求职信
2014/05/26 职场文书
cf战队收人口号
2014/06/21 职场文书
自动化专业大学生职业生涯规划范文:爱拚才会赢
2014/09/12 职场文书
自查自纠工作情况报告
2014/10/29 职场文书
感恩的心主题班会
2015/08/12 职场文书
2016党员发展对象培训心得体会
2016/01/08 职场文书