20201029_陈宇_

日志

学习总结:

jQuery:

​ jQuery是一个优秀的javascript的轻量级框架,兼容css3和各大浏览器,提供了HTML文档操作、事件处 理、动画设计和Ajax交互操作

​ jQuery是一个JavaScript框架,目的:简化JS开发

​ 本质上是一个外部的js文件,在该文件中封装了很多js代码,实现了很多功能

​ 轻量级:1)学习难易程度、2)该框架对项目的影响程度

​ 框架:是完成某种功能的半成品软件

4 jQuery与JS区别:

​ jQuery虽然本质上也是js,但如果使用jQuery的属性和方法那么必须保证对象是jQuery对象而不是js对象

​ 通过js方式获取的是js对象,通过jQuery方式获取的是jQuery对象

​ 两者区别:

​ 1. jQuery对象与js对象相互转换

​ js –> jq:

​ $(js对象) 或 jQuery(js对象)

​ jq –> js:

​ jq对象[索引] 或 jq对象.get(索引)

jq对象本质上是js数组

​ 2.页面加载事件

​ js:

​ window.onload=function(){}

​ jq:

​ $(function(){})

​ $(document).ready(function(){})

​ 区别:

​ js:只能定义一次,如果定义了多次,后加载的会覆盖先加载的

​ jq:可以定义多次

​ 3. 事件绑定

​ js:

​ js对象.onclick=function(){}

​ jq:

​ jq对象.click(function(){}) 回调函数

​ jq对象.on(事件,function(){})

​ 4. css样式设置:通过对象直接修改

​ js:

​ js对象.style.样式名=样式值

​ jq:

​ jq对象.css('样式名','样式值')

​ jq对象.addClass() 样式名:驼峰式,css横杠 都支持

jQuery选择器:

​ 基本选择器:

image-20201029225246680

​ 层级选择器:

image-20201029225306062

​ 属性选择器:

​ 1. 属性名选择器:

​ 语法:$("A[属性名]") 包含指定属性的选择器

​ 2.属性选择器:

​ 语法:$("A[属性名='值']") 包含指定属性等于指定值的选择器

​ 3.复合属性选择器:

​ 语法:$("A [属性名='值'] [ ]…") 包含多个属性条件的选择器

​ 基本过滤选择器:

image-20201029225454549

​ 表单过滤选择器:

image-20201029225520711

jQuery的DOM操作:

​ 内容操作:

image-20201029225609243

​ 属性操作:

image-20201029225629069

​ prop()特点:在jq 1.6版本推出,解决attr设计缺陷,专门来处理布尔类型的属性,如:checked,selected等

​ css样式操作:

image-20201029225827851

​ 文档CRUD操作:

image-20201029225844817

学习总结:

​ 今天一天就讲完了jQuery,练习了一下,感觉对于js来说是操作上是更加简单了,这是学习了Boot之后的第二个框架,感觉这个比Boot好用一些。今天还了解了一下tomcat,感觉十分高大上,离发布项目到网上是越来越近了。

标签

评论

this is is footer