JavaWEB笔记13 jQuery介绍及常用操作

最新推荐文章于 2022-01-20 15:37:10 发布

RainOnTheMoon

最新推荐文章于 2022-01-20 15:37:10 发布

阅读量430

点赞数

分类专栏：笔记文章标签： jquery javascript html

本文链接：https://blog.csdn.net/weixin_46702804/article/details/120007986

版权

本文详细介绍了jQuery的基础知识，包括jQuery的引入、加载模式，原生DOM对象与jQuery对象的转换，以及jQuery的选择器、内容操作、属性处理、CSS样式设置、节点操作和事件处理。通过实例展示了如何利用jQuery简化JavaScript编程，如设置和获取元素内容、添加和删除类、以及实现动画效果。

摘要由CSDN通过智能技术生成

JavaWEB笔记13 jQuery介绍及常用操作

文章目录

JavaWEB笔记13 jQuery介绍及常用操作

一.jQuery简介：

1.jQuery介绍：

jQuery是JS的一个前端库，是对于原生JS进行封装后调用，jQuery极大地简化了JS编程，使用jQuery首先需要将jQuery添加进入html页面：

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

这种引入jQuery的形式为本地引入，需要事先在网上下载对应的jQuery源码文件：jQuery.js，并放到对应的html文件目录下js目录下，另一种方法为引用网络资源有：

官网jquery压缩版引用地址:
3.1.1版本:<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
3.0.0版本:<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
2.1.4版本:<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>

2.jQuery书写风格：

案例：实现给按钮绑定点击事件：

$('button').click(function(){
   alert("Hello world");})

类比JS原生dom的方式进行绑定事件：

document.querySelector('button').onclick=function(){
   alert("Hello JQuery");}

jQuery代码风格：

使用美元符号$ 作为标签对象，并使用选择器进行选中，或将美元符号换成 jQuery，但是没有美元符号方便，一般都使用美元符号
$(’ ')单引号中间的语法遵循选择器语法
jQuery使用连缀风格进行修饰：$(‘div’).css(‘color’,‘red’).css(‘font-size’,‘30px’)，并且在jQuery中每修饰一次就返回一次，所以使用连缀进行修饰