- 本地存储:1、数据存储在浏览器中;2、设置、读取方便,甚至页面刷新也不会丢失数据;3、容量大;4、只能存储字符串
- window.sessionStorage:1、生命周期为关闭浏览器窗口;2、同一个窗口页面数据可以共享;3、以键值对的形式进行存储
- 存储数据:sessionStorage.setItem(key,value)
- 获取数据:sessionStorage.getItem(key)
- 删除数据:sessionStorage.removeItem(key)
- window.localStorage:1、生命周期永久生效,除非手动删除;2、同一个窗口页面数据可以共享;3、以键值对的形式进行存储
- 存储数据:localStorage.setItem(key,value)
- 获取数据:localStorage.getItem(key)
- 删除数据:localStorage.removeItem(key)
- 删除所有数据:localStorage.clear()
- window.sessionStorage:1、生命周期为关闭浏览器窗口;2、同一个窗口页面数据可以共享;3、以键值对的形式进行存储
- jQuery:快速的、简洁的JavaScript库 ;$是JavaScript的别称;$是JavaScript的顶级对象
- 基本使用:
- 1、下载:官网地址-- https//jquery.com/
- 2、获取元素:$('span')
- 3、DOM对象和jQuery对象互换:
- DOM转换为jQuery:$(DOM对象)
- jQuery转换为DOM :$('div')[index]、$('div').get(index)
- 补充:1、$(function(){ });2、$(document).ready(function(){ });
- jQuery常用API
- jQuery基础选择器:$('选择器')
- 隐式迭代:把匹配的所有元素内部进行遍历,给每一个元素添加css这个方法
- jQuery筛选选择器:
- 链式编程:节省代码量---$(this).css('color','red').sibling().css('color','')
- jQuery样式操作:
- 1、操作css方法
- 1、参数只写属性名,返回属性值
- 2、参数是属性名、属性值、逗号分隔,是设置一组样式,属性必须加引号,值如果是数字可以不用跟单位和引号
- 3、参数可以是对象形式,方便设置多组样式,属性名和属性值用冒号隔开,属性可以不加引号
- 设置类样式方法:添加类:$("div").addClass("current");
- 1、操作css方法
- jQuery效果(jQuery API中文文档)
- show([speed,[easing],[fn]])
- speed:三种预定速度的字符串之一或者表示动画时长的毫秒数
- easing:用来指定切换效果--默认swing,可用参数“linear”
- fn:回调函数,在动画完成时执行一次函数,每个元素执行一次
- stop():方法用于停止动画或者效果,写在动画或者效果的前面
- fadeTo(speed,opacity,[ ]):速度和修改透明度
- animate(params,[speed],[easing],[fn] ):
- params:想要改变的样式属性,以对象形式传递,必须写,属性名可以不用带引号,如果时符合属性则采用驼峰命名法,
- speed:三种预定速度的字符串之一或者表示动画时长的毫秒数
- easing:用来指定切换效果--默认swing,可用参数“linear”
- fn:回调函数,在动画完成时执行一次函数,每个元素执行一次
- jQuery属性操作:
- 获得属性值:element.prop(“属性名”)例如:$(“a”).prop(“herf”);
- 设置属性值:attr(“属性”,“属性值”)
- jQuery内容文本值
- 获取元素内容:html()、text()、val()--表单
- 设置元素内容:html(“内容”)、text(“内容”)、val(“内容”)
- 补充:.toFixed(2)--保留两位小数
- jQuery元素操作:主要是指遍历、创建、添加、删除元素
- 遍历:$("div").each(function (index,domEle){ xxx;}),domEle是DOM元素对象
- 创建:$("<li></li>");
- 添加:
- 内部添加:element.append("内容")--后面;element.prepend("内容")--前面
- 外部添加:element.after("内容")--后面;element.before("内容")--前面
- 删除:
- element.remove()--删除匹配元素本身
- element.empty()--删除匹配严肃集合中所有的子节点
- element.html("")--清空匹配的元素内容
- jQuery尺寸、位置操作
- 尺寸操作
- 位置操作:
- 1、offset():设置或获得元素偏移,相对于文档的位置 ,跟父级没有关系
- position()获取元素偏移量,用于返回被选择的元素相对于父级的偏移量,如果父级没有定位,则以文档为准,只能获取,不能设置偏移量
- scrollTop()/ scrollLeft():设置或获取元素被卷去的头部和左侧
- 基本使用:
jQuery--本地存储
转载请注明出处或者链接地址:https://www.qianduange.cn//article/12393.html
相关文章
-
html5 标签的分类及样式的分类和优先级
-
前端开发 4: jQuery
-
基于javaweb mysql的ssm固定资产管理系统(java ssm jsp jquery bootstrap mysql)
-
基于html5的国家历史文物网站的设计与实现-计算机毕业设计源码63653
-
无涯教程-jQuery - Button组件函数
-
网页开发 HTML
-
HTML:七天学会写基础网页11
-
Web前端资深架构师分享学习经验及总结,jQuery入门到精通(四,2024最新前端笔经
-
echarts点击与高亮事件经验小结
-
解决用pyecharts画图时输出保存的html文件或在notebook中输出的图像空白的问题,亲测有效!!!
发布的文章
情人节程序员用HTML网页表白【爱的计时】 HTML5七夕情人节表白网页源码 HTML CSS JavaScript
2024-06-22 01:06:05
html5 标签的分类及样式的分类和优先级
2024-06-22 01:06:04
前端开发 4: jQuery
2024-06-22 01:06:02
基于javaweb mysql的ssm固定资产管理系统(java ssm jsp jquery bootstrap mysql)
2024-06-22 01:06:36
基于html5的国家历史文物网站的设计与实现-计算机毕业设计源码63653
2024-02-03 12:02:00
无涯教程-jQuery - Button组件函数
2024-06-22 01:06:21
计算机毕业设计 基于html5的图书管理系统的设计与实现 Java实战项目 附源码 文档 视频讲解
2024-06-22 01:06:18
网页开发 HTML
2024-06-22 01:06:17
HTML:七天学会写基础网页11
2024-06-22 01:06:13
Web前端资深架构师分享学习经验及总结,jQuery入门到精通(四,2024最新前端笔经
2024-06-22 01:06:10
大家推荐的文章