欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

如何使用js中JQuery框架

程序员文章站 2022-03-15 23:21:36
...

这次给大家带来如何使用js中JQuery框架,使用js中JQuery框架的注意事项有哪些,下面就是实战案例,一起来看一下。

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是:倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互,极大地简化来了JavaScript编程。  jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器,如IE6.0+、FF1.5+、Safari2.0+、Opera9.0+等。

JQuery的安装步骤:

1.下载相应的文件库(每一个 同一版本的JQuery文件库,都分为两个,一个是未压缩版,可查看源码,开发时使用,(jquery-3.3.1.js)

一个是压缩版,将注释,空格均作了删除,将变量字符数删少,产品上线时使用(jquery-3.3.1.min.js) 带min 一我们使用这个

(http://jquery.com/ 可下载)

2.将JQuery的JS文件拷贝到WEB的目录下(放在创建的网页目录)

3.页面引用js文件(JQuery的JS)

        <script type="text/javascript" src="js/jquery-3.3.1.js"></script>

4.页面中载入JQuery

(上面的script只是引用jQuery的,想要载入JQuery只能在写一个script)

有三种方法:

第一种:

$(document).ready(function(){  
func(xxx)//执行函数
                       });  
//.ready函数是当DOM(文档对象模型)已经加载,并且页面(包括图像)已经完全呈现时,会发生ready事件,为了防止文档在完全加载(就绪)之前运行 jQuery 代码。

第二种:

$(function(){  
     func(xxx)//执行函数
             });

第三种:

jQuery(function($) {  
     func(xxx)//执行函数
                  });

基本语法:

$(selector).action()

美元符号定义JQuery

选择符(selector)"查询"和“查找” HTML元素

JQuery的action()执行对元素的操作

        <script type="text/javascript">
		$(function(){
			alert("helloWorld");
		})
	</script>

相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!

推荐阅读:

filter怎样全局使用

如何获取dom内class的值

以上就是如何使用js中JQuery框架的详细内容,更多请关注其它相关文章!