一. JQuery概述
Jquery是一个优秀的Javascrīpt框架。它是轻量级的js库(压缩后只有21k) ,它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。jQuery使用户能更方便地处理HTML,documents、events、实现动画效果,并且方便地为网站提供AJAX交互,jQuery能够使用户的html页保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。
二. JQuery初步
1.如果在<body onload=””>中有onload事件那么不在自动执行ready事件
2.Dom对象不能使用jquery的方法,JQuery对象不能使用DOM中的方法,但他们之间可以相互转化
3.DOM对象和JQuery对象的转化
(1).DOM对象转化成JQuery对象的方式 :
$(DOM对象)--------->JQuery对象
var dom=window.document;//DOM对象
var $dom=$(dom);//JQuery对象
(2).JQuery对象转化成DOM对象
JQuery对象返回的是一个数组对象:JQuery对象[index] 或 JQuery对象.get(index)
示例:
alert($("#thead")[0].innerHTML);//获取标签和文本内容 先转化成DOM对象
或 Var dom=$("tr")[$(tr).size()-1] (最后一个值) 或
Var dom=$(".rdc").get(0)
三. JQuery案例+讲解:
1.页面载入事件:
/** JQuery对象处理匿名函数 */
$(document).ready(function(){
alert("JQuery的第一个入门案例");//加载HTML,不需等待,立即加载
});
2.选择器:
<script type="text/javascript">
$(document).ready(function(){
alert($("#thead"));//ID选择器JQuery对象
alert($(".rdc"));//Class选择器JQuery对象
alert($("*"));//匹配所有元素选择器的JQuery对象
alert($(".rdc").get(0).innerHTML);
alert($("tr"));//根据给定的元素名称获取所有的jquery对象 匹配所有的tr标签
alert($("tr,tr.rdc"))//匹配所有选择器的JQuery组合对象 匹配所有的tr及tr下的rdc
});
</script>
页面源码:
<table border="1px">
<thead>
<tr id="thead">
<th>姓名</th>
<th>密码</th>
<th>邮箱</th>
</tr>
</thead>
<tbody>
<tr class="rdc">
<td>zhang sansan1</td>
<td>zhang sansan1</td>
<td>zhang sansan1@163.com</td>
</tr>
<tr
<td>zhang sansan2</td>
<td>zhang sansan2</td>
<td>zhang sansan2@163.com</td>
</tr>
</tbody>
</table>
分享到:
相关推荐
《jQuery小结》 在Web开发领域,jQuery是一款极为重要的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。本篇文章将深入探讨jQuery的核心知识点,包括选择器与筛选方法、样式操作、效果展示、DOM...
**jQuery1.4.1 小结** jQuery 是一个广泛使用的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互。在本文中,我们将深入探讨jQuery 1.4.1版本的一些核心特性、改进和常用API。 #...
### jQuery Mobile 经验小结 #### 一、概述 jQuery Mobile 是一款基于 HTML5 的移动设备框架,它为开发者提供了构建响应式网站、应用程序的能力。通过使用 jQuery Mobile,可以轻松地创建适用于不同屏幕尺寸的网页...
### Jquery.validate表单验证详解 #### 一、引言 在Web开发中,表单验证是确保数据质量的关键步骤。传统的JavaScript表单验证方法往往冗长且难以维护,而jQuery Validate插件则以其简洁、高效及易于扩展的特性成为...
jQuery 动画jQuery 提供了多种方法来创建动画效果,如 fadeToggle(), fadeIn(), fadeOut(), slideToggle(), slideUp(), slideDown() 等。例如,要淡入淡出一个段落,我们可以这样编写代码: $("#fade").click...
### Jquery使用小结 #### 一、Jquery简介与基础使用 JQuery 是一款流行的 JavaScript 库,它简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等开发工作。通过本文,我们将对 JQuery 的基础知识进行总结,并...
总结来说,jQuery插件开发中的五种形态小结通过一系列的示例和说明,为开发者展示了如何创建一个高效、可维护的插件。这五个形态涉及到了代码的独立性、链式操作、插件的可配置性、生命周期的管理、无冲突处理以及...
这篇博客"jquery取单选,复选,下拉小结"是关于如何使用jQuery来操作网页中的单选按钮(radio)、复选框(checkbox)以及下拉列表(select)的选择项。下面我们将详细探讨这些知识点。 首先,我们来讨论如何使用...
《JQuery可编辑表格小结》 在网页开发中,数据展示往往需要用到表格,而让表格中的数据可编辑则能极大地提升用户体验。JQuery库以其简洁的API和强大的功能,成为了实现这一目标的理想选择。本文将对使用JQuery构建...
在本文中,作者通过个人使用jQuery的实践经验,总结出了五个重要知识点,让我们一起来探讨一下这些知识点的具体内容。 1. jQuery对象与原生DOM对象的互转...希望本文作者的经验小结,能为你的jQuery学习之旅带来便利。
NULL 博文链接:https://chenzheng8975.iteye.com/blog/1616594
《这些年,我收集的JQuery代码小结》 在网页开发中,jQuery作为一个强大的JavaScript库,极大地简化了DOM操作、事件处理以及动画效果的实现。本文将总结一些实用的jQuery代码片段,帮助开发者提高效率,优化代码...
jQuery是一个快速、小巧的JavaScript库,它封装了JavaScript的动画效果和Ajax等技术,简化了这些技术在使用时的操作。在现代Web开发中,AJAX技术用于实现页面的异步更新,jQuery通过提供的一系列AJAX相关方法,极大...
11. 小结1 12. 选择器练习 13. 创建和插入节点 14. 重写 JS 实验之分类添加内容 15. 删除及清空节点 16. 重写 JS 实验之员工管理 17. 克隆和替换节点 18. 包裹节点 19. html() 方法 & val() 方法 20. 小结2 21. CSS ...
### JQuery选择器特辑详细小结 #### 一、基本选择器 基本选择器是JQuery中最基础也是最常用的选择器,通过元素的ID、类名(Class)和标签名等来查找DOM元素。基本选择器主要包括: - ID选择器:通过元素ID来选取...
尚硅谷_佟刚_jQuery_第一天小结【】12.尚硅谷_佟刚_jQuery_选择器的练习【】13.尚硅谷_佟刚_jQuery_创建节点及插入节点【】14.尚硅谷_ 资源太大,传百度网盘了,链接在附件中,有需要的同学自取。
jQuery,作为一款广泛使用的JavaScript库,提供了丰富的API和简洁的语法来操作DOM、处理事件以及实现动画效果。这里我们将深入探讨jQuery的一些注意事项和常用语法,这对于任何正在学习或使用jQuery的人来说都是十分...
今天为大家推荐的是2013年的第一期,在这期里面十个jQuery插件涵盖了响应式的网格布局插件、图片放大插件、表单元素中自定义select插件,google 地图插件、文件拖放上传插件、tooltip提示插件、3D旋转菜单等等
jQuery树形控件zTree是一款基于jQuery的多功能树形控件插件,它广泛应用于Web开发中,提供了一个方便的方式来实现树状数据结构的展示与管理。zTree具备优异的性能,支持灵活的配置选项,并能够与多种功能组合使用,...