001、选择器类型
<script type="javascript">
<!-- 1、相对选择器-->
$("td", $(this)).css("background", "red"); //$(this)元素下的td
<!-- 2、多条件选择器-->
$("div,span,p[name='p1']") //选择div,span,p[name='p1']三种标签
<!-- 3、层次选择器-->
$("#div li")获取div下的所有li元素(后代,子,子的子....)
$("#div > li")获取div下的直接li子元素//注意空格
$(".menuitem + div")获取样式名为menuitem之后的第一个div元素
$(".menuitem ~ div")获取样式名为menuitem之后的所有的div元素
</script>
001.1伪类选择器
:first //集合中的第一个元素 $("ul li:first")
:last $("ul li:last")
:eq(n) $("ul li:eq(2)")
:even //偶数 0 2 4 6 8 。。。
:odd //奇数 1 3 5 7 9 。。。
:lt(n) <
:gt(n) >
:not(selector) $(
"li :not(:first)"
).hide();
001.2父辈选择器
parent([selector]);//直接父元素
parents([selector]);//所有父元素
parentUtil([selector]);//提供搜索范围
001.3同辈选择器(不包含当前元素)
next([selector]):获取当前元素的下一个元素,可以指定选择器$("h3").next("li").css("color", "#FCF");
nextAll([selector]):获取当前元素的所有同辈元素,可以指定选择器
nextUtil([selector]):获得A到B之间的同辈元素$("#div1").nextUtil("div3").css("border", "1px solid red");
prv([selector])
prvAll([selector])
siblings([selector])
andSelf();:包含自身
$("#div1").nextUtil("div3").css("border", "1px solid red").andSelf();
001.4子类选择器
children([selector]);:直接子元素
find(selector); :参数必选,选择范围为所有子元素
002、属性操作
<script type="javascript"> <!--某元素下具有某属性的子元素--> $("#table02 .trSelected").length; <!--具有某属性的元素--> $("div[name]").length; <!--具有某属性值的元素--> $("div[class='trSelected']").length; <!--属性字段--> $("img[src^='.jpg']") $("img[src!='.pdf']") $("img[src$='.jpg']") <!--多属性字段--> $("div[class='trSelected'] [name='ssj']") </script>
003、遍历radio
$(document).ready(function() { var ele=$("input[name='exchangelx'][type='radio']").each(function(){ alert(this.value); }); })
004、jquery初始化函数
(function ($) {})(jQuery);
005、获得元素个数
$("ul li").length
006、从集合中排出某元素
$("A").not($(dom)).slideUp('slow');
007、动态绑定事件
$("scopeDom").delegate("targetDom","click",function(){}); //jquery绑定动态dom事件(在scopeDom范围内为targetDom绑定click事件, 其中选择器仅支持#和.不支持复杂条件)
008、jquery清除同辈中指定的元素
$("#span_qt a:eq(0)").siblings("a").remove(); <span id="span_qt"> <a name="null" href="javascript:void(0);" class="cur" >全部</a> <a name="null" href="javascript:void(0);" class="cur" >aaa</a> <a name="null" href="javascript:void(0);" class="cur" >bbb</a> </span>
009、jquery方法
01:get(n);返回dom对象 $("ul li").get(1).css("color", "red"); //这个是错误的
$("ul li").eq(1).css("color", "red"); //这个是正确的
02、filter(selector);当前集合过滤,区别于find()子集合
03、not(selector);当前集合下排除
04、is(selector);判断是否是同一对象
05、slice(start,[end]);当前集合区间 $("li ").slice(2); 第三个li $("li ").slice(2,5);前闭后开, 3-4个li
相关推荐
**读者评价摘要**: - **David Sills (JavaLobby, Dzone)**:这本书是一本优秀的作品,是Manning出版社“in Action”系列中的一个值得骄傲的继承者。它易于阅读且充满了实用代码。实验室页面是一种探索库的奇妙方式...
从零开始学习jQuery (一) 开天辟地入门篇 2 一.摘要 2 二.前言 3 三.什么是jQuery 3 四.Hello World jQuery 4 五.启用Visual Studio 对jQuery的智能感知 6 六.在独立的.JS文件中启用脚本智能感知 8 七.总结 9 从零...
1.SM3的国密算法; 2.Jquery语言实现; 3.算法不可逆,不可破解,安全性高; --------------------------------------------
MD5(Message-Digest Algorithm 5)是一种广泛使用的哈希函数,可以将任意长度的数据映射为固定长度的摘要信息,通常用于数据校验、密码存储等场景。在前端开发中,有时候为了增强数据安全性,可能需要在客户端对...
jQuery dPassword MD5加密是一种基于JavaScript的加密方法,它结合了流行的jQuery库和MD5哈希算法,为用户密码提供了一种安全的处理方式。在Web应用中,尤其是在涉及到用户敏感信息如密码时,通常会使用加密技术来...
- **内容摘要**:这部分提供了关于jQuery函数和方法的详细文档,方便读者在开发过程中查阅所需的信息。 11. **JavaScript技巧 (附录B)** - **章节概述**:这一附录收集了一些实用的JavaScript代码片段,帮助读者...
**jQuery.js和jQuery.md5.js在Web开发中的应用** 在Web开发中,安全性和数据完整性是至关重要的。MD5(Message-Digest Algorithm 5)是一种广泛使用的哈希函数,能够将任意长度的数据转换为固定长度的摘要信息。...
MD5(Message-Digest Algorithm 5)和SHA1(Secure Hash Algorithm 1)都是常见的哈希函数,它们可以将任意长度的数据转化为固定长度的摘要,具有不可逆性,常用于验证数据完整性或密码存储。 1. **MD5加密**:MD5...
手风琴插件常用于FAQ(常见问题解答)、菜单栏、导航条、内容摘要等场景。 ### 2. jQuery手风琴插件的基本使用 要使用jQuery手风琴插件,首先需要在页面中引入jQuery库和jQuery UI库,因为手风琴效果是jQuery UI的...
网格视图是将数据以等间距的单元格形式排列的布局方式,常用于展示图片、文章摘要等信息。它能够有效地利用网页空间,使内容看起来更有组织且易于阅读。在网页设计中,网格视图通常采用响应式设计,能适应不同设备...
##### 摘要 本篇文章作为系列教程的开端,旨在为初学者提供一个全面了解JQuery的起点。无论你是刚接触编程的新手还是已经有了一定前端经验的开发者,都能从中找到有价值的信息。文章将覆盖JQuery的基本概念、安装...
本教程将深入探讨如何使用jQuery来实现一个卡片页,这是一个常见的UI设计模式,适用于展示信息丰富的列表,如产品目录、用户简介或文章摘要。卡片页能够使内容更加有组织,易于阅读和交互。 首先,我们需要理解卡片...
- 幻灯片展示:这是一种网页设计技巧,通过自动或用户触发切换,以展示一系列内容,如新闻标题、图片或文章摘要。 2. **jQuery选择器** 在创建新闻幻灯片时,首先需要选取要操作的HTML元素,jQuery提供了丰富的...
标题中的“jquery垂直向上逐条滚动新闻列表”指的是使用jQuery库实现的一种常见网页动态效果,这种效果常见于新闻网站,能够使最新的新闻标题或摘要从屏幕底部向上滚动,以吸引用户的注意力并展示更多信息。...
这个插件特别适用于新闻摘要、文章标题或者评论内容的展示。 ### 二、安装与引入 在项目中使用`jquery-textEllipsis`,首先需要确保已经引入了jQuery库。然后,你可以通过以下两种方式引入该插件: 1. **下载...
其中,文字云图(词云图)是常见的数据可视化形式之一,它以大小不一的文字来展示词语的频率,视觉效果独特,常用于新闻摘要、社交媒体分析等领域。本项目以"通过HTML + jquery + echarts 实现文字云图"为主题,提供...
【jQuery niceTitle插件详解】 在网页设计中,链接预览是一种提高用户体验的巧妙方法,它可以在用户将鼠标悬停在链接上时显示链接指向页面的摘要信息,无需离开当前页面即可了解链接内容。"jQuery niceTitle"是一个...
接收到的XML数据会被解析,提取出标题、摘要、发布日期等关键信息,然后用jQuery Mobile的组件来展示这些内容。例如,每个RSS条目可以被包装成一个列表项(`<li>`),标题作为链接,摘要作为描述,发布日期可以显示...
- 可以显示摘要信息。 ##### 4. jQZoom - **简介**:用于放大图片的插件。 - **特点**: - 支持鼠标悬停时放大。 - 可以设置放大比例。 ##### 5. jCarouselLite - **简介**:轻量级的图片轮播插件。 - **特点**...
iGoogle是Google推出的一个个性化首页服务,允许用户自定义首页布局,添加各种小工具,如天气预报、新闻摘要等。这些小工具可以在页面上自由移动,提供了一种高度定制化的浏览体验。 **3. 拖动功能实现** 在jQuery...