美文网首页
关于JQuery

关于JQuery

作者: 拾柒_aab0 | 来源:发表于2019-11-17 14:48 被阅读0次

jQuery到底是什么呢?

jQuery 是一个 JavaScript 库。
jQuery 极大地简化了 JavaScript 编程。
jQuery 是一个“写的更少,但做的更多”的轻量级 JavaScript 库。

JQuery语法

jQuery 语法
jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。

基础语法是:$(selector).action()

美元符号定义 jQuery
选择符(selector)“查询”和“查找” HTML 元素
jQuery 的 action() 执行对元素的操作
示例
$(this).hide() - 隐藏当前元素

$("p").hide() - 隐藏所有段落

$(".test").hide() - 隐藏所有 class="test" 的所有元素

$("#test").hide() - 隐藏所有 id="test" 的元素

提示:jQuery 使用的语法是 XPath 与 CSS 选择器语法的组合。在本教程接下来的章节,您将学习到更多有关选择器的语法。
文档就绪函数
您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready 函数中:

$(document).ready(function(){

--- jQuery functions go here ----

});

jQuery hide() 和 show()

通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素:

例:

 $("#hide").click(function(){
 $("p").hide();
 });

$("#show").click(function(){
$("p").show();
});

语法:
$(selector).hide(speed,callback);

$(selector).show(speed,callback);

jQuery toggle()

通过 jQuery,可以使用 toggle() 方法来切换 hide() 和 show() 方法。

显示被隐藏的元素,并隐藏已显示的元素:
语法:
$(selector).toggle(speed,callback);
可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。

jQuery 效果 - 滑动

jQuery 滑动方法
通过 jQuery,您可以在元素上创建滑动效果。

jQuery 拥有以下滑动方法:

slideDown()
slideUp()
slideToggle()
jQuery slideDown() 方法
jQuery slideDown() 方法用于向下滑动元素。

语法:
$(selector).slideDown(speed,callback);
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是滑动完成后所执行的函数名称。

下面的例子演示了 slideDown() 方法:

实例

$("#flip").click(function(){
$("#panel").slideDown();
});

jQuery slideUp() 方法
jQuery slideUp() 方法用于向上滑动元素。

语法:
$(selector).slideUp(speed,callback);
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是滑动完成后所执行的函数名称。

下面的例子演示了 slideUp() 方法:

实例

$("#flip").click(function(){
$("#panel").slideUp();
});

相关文章

  • Ajax实现登陆验证

    关于jquery与Ajax jQuery 提供多个与 AJAX 有关的方法。通过 jQuery AJAX 方法,能...

  • jQuery UI的版本及特性

    关于jQuery UI的详细了解:学习jQuery UI 版本: jQuery UI 1.9.2 发布,这是 jQ...

  • jQuery知识点记录

    关于jQuery的知识点记录 1.jQuery基础 core functionality: getting som...

  • JS链式编程

    关于链式编程最典型的就是jQuery(虽然我们现在已经很少直接使用jQuery),我们可以通过jQuery完成一系...

  • JQuery关于(function($){ })(jQuery)

    (function($){ })(jQuery):执行(jQuery)函数,并把jQuery对象作为实参,然后就会...

  • jquery使用(三):常用方法区分

    一、关于jQuery中html()、text()和val()的区别 二、jQuery中attr()和prop()的...

  • 关于jQuery和Vue两者技术架构的比较分析报告

    关于jQuery和Vue两者技术架构的比较分析报告 jQuery jQuery已经过时了。略做点补充:Zepto也...

  • 关于jQuery

    jQuery1.x版本和jQuery2.x版本有什么区别? jQuery1.x支持IE6,7,8,但是jQuery...

  • 关于jQuery

    jQuery是一个轻量级的"写的少,做的多"的JavaScript库。 写JavaScript代码时为什么推荐使用...

  • 关于jQuery

    1.库和任务的区别 框架与库之间最本质区别在于控制权:you call libs, frameworks call...

网友评论

      本文标题:关于JQuery

      本文链接:https://www.haomeiwen.com/subject/hvupictx.html