jQuery 是什么? 能干什么? 下面本篇文章来给大家介绍一下. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
jQuery 是一个简洁而快速的 JavaScript 库, 可用于简化事件处理, html 文档遍历, Ajax 交互和动画, 以便快速开发网站.
目的是让开发者更容易地在网站上使用 JavaScript. 它不是一种单独的编程语言, 与 JavaScript 一起工作. 使用 jQuery, 将用更少的资源做更多的事情.
jQuery 库为 web 脚本编程提供了通用 (跨浏览器) 的抽象层, 使得它几乎适用于任何脚本编程的情形. jQuery 通常能为我们提供以下功能:
1, 方便快捷获取 DOM 元素
如果使用纯 JavaScript 的方式来遍历 DOM 以及查找 DOM 的某个部分编写很多冗余的代码, 而使用 jQuery 只需要一行代码就足够了. 例如, 找到所有应用了. content class 样式的 div 中所有的 P 标签, 只需要下面的一行代码:
$('div.content').find('p');
2, 动态修改页面样式
使用 jQuery 我们可以动态的修改页面的 CSS 即使在页面呈现以后. jQuery 仍然能够改变文档中某个部分的类或者个别的样式属性. 例如, 找到页面所有的 ul 标签的第一个 li 子标签, 然后为它们增加名为 active 的样式, 代码如下:
$('ul> li:first').addClass('active');
3, 动态改变 DOM 内容
使用 jQuery 我们可以很容易地对页面 DOM 进行修改, 例如, 为 ID 为 "container" 的元素添加一个链接:
$('#container').append('<a href="more.html">more</a>');
4, 响应用户的交互操作
jQuery 提供了截获形形色色的页面事件 (比如用户单击某个链接) 的适当方式, 而不需要使用事件处理程序拆散 HTML 代码. 此外, 它的事件处理 API 也消除了经常困扰 Web 开发人员浏览器的不一致性.
- $('button.show-details').click(function() {
- $('div.details').show();
- });
上面的代码表示: 为使用的. show-details 样式的 button 元素添加一个 click 事件, 事件就是: 显示使用. details 样式的 DIV.
5, 为页面添加动态效果
jQuery 中内置的一批淡入, 擦除之类的效果, 以及制作新效果的工具包, 为此提供了便利.
- $(function () {
- $("#btnShow").click(function () {
- $("#msubject").hide("slow");
- });
- });
6, 统一 Ajax 操作
jQuery 统一了多种浏览器的 Ajax 操作, 使得开发人员更多的专注服务器端开发.
- function (data, type) {
- // 对 Ajax 返回的原始数据进行预处理
- return data // 返回处理后的数据
- }
7, 简化常见的 JavaScript 任务
除了这些完全针对文档的特性之外, jQuery 也改进了对基本的 JavaScript 数据结构(例如迭代和数组操作等).
- $.each(obj, function(key, value) {
- total += value;
- });
扩展资料
jQuery 允许开发者使用从 CSS1 到 CSS3 几乎所有的选择器, 以及 jQuery 独创的高级而且复杂的选择器, 另外还可以加入插件使其支持 XPath 选择器, 甚至开发者可以编写属于自己的选择器. 由于 jQuery 支持选择器这一特性, 因此有一定 CSS 经验的开发人员可以很容易的切入到 jQuery 的学习中来.
jQuery 封装了大量常用的 DOM 操作, 使开发者在编写 DOM 操作相关程序的时候能够得心应手. jQuery 轻松地完成各种原本非常复杂的操作, 让 JavaScript 新手也能写出出色的程序.
更多 Web 前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/jquery/16682.html