今日完成:
Web 存储 API 提供了 sessionStorage （会话存储） 和 localStorage（本地存储）两个存储对象来对网页的数据进行添加、删除、修改、查询操作。
localStorage 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除。
sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。
存储对象属性
属性
length
描述
返回存储对象中包含多少条数据。
存储对象方法
方法 描述
key(n) 返回存储对象中第 n 个键的名称
getItem(keyname) 返回指定键的值
setItem(keyname, value) 添加键和值，如果对应的值存在，则更新该键对应的值。
removeItem(keyname) 移除键
clear() 清除存储对象中所有的键
Web 存储 API
属性
描述
window.localStorage 在浏览器中存储 key/value 对。没有过期时间。
window.sessionStorage 在浏览器中存储 key/value 对。 在关闭窗口或标签页之后将会删除这些数据。
//--------------------------------------------------------------------------------------------------------------------------
明确概念(明确清晰的知道概念,而不是模模糊糊,似是而非,容易与其它概念混淆)
什么是API?
研发人员A开发了软件A，研发人员B正在研发软件B。
有一天，研发人员B想要调用软件A的部分功能来用，但是他又不想从头看一遍软件A的源码和功能实现过程，怎么办呢？
研发人员A想了一个好主意：我把软件A里你需要的功能打包好，写成一个函数；你按照我说的流程，把这个函数放在软件B里，就能直接用我的功能了！
其中，API就是研发人员A说的那个函数。
总结起来:API就是接口，就是通道，负责一个程序和其他软件的沟通，本质是预先定义的函数。
API接口就是完成和其他组件的交互的地方。
//---------------------------------------------------------------------------------------------------------------------------------------------------------------------
什么是js节点?
节点:页面中所有的内容（标签、属性、文本（文字、换行、空格、回车）），Node
扩展:
文档:document
元素:页面中所有的标签，元素（element）
----------------------------------------------------------------
节点的属性：
nodeType:节点的类型：1标签, 2属性， 3文本
nodeName:节点的名字：1.标签节点(大写的标签名字)，2.属性节点(小写的属性名字)，3.文本节点:#text
nodeValue:节点的值：标签节点----null，属性节点-----属性值，文本节点-----文本内容
----------------------------------------------------------------------------------------------------------
获取指定节点:
代码 用法
firstChild 获取当前元素节点的第一个子节点
firstElementChild 获取当前元素节点的第一个元素节点
lastChild 获取当前元素节点的最后一个子节点
lastElementChild 获取当前元素节点的最后一个元素子节点
ownerDocument 获取该节点的文档根节点
parentNode 获取当前节点的父节点
previousSibling 获取当前节点的前一个同级节点
previousElementSibling 获取当前节点的前一个同级元素节点
nextSibling 获取当前节点的后一个同级节点//获取某个元素的后一个兄弟节点,ex:在控制台输出:console.log(a.nextSibling);
nextElementSibling 获取当前节点的后一个同级元素节点//获取某个元素的后一个兄弟元素,ex:在控制台输出:console.log(a.nextElementSibling);
attributes 获取当前元素节点的所有属性节点集合
childElementCount 获取当前节点的元素节点的个数
children 获取当前节点的所有元素节点
ex:1.获取当前节点的父级节点：
//获取当前标签的id对象
var a = document.getElementById("id名称");
//在控制台输出当前标签的父级节点
console.log(a.parentNode);
//在控制台输出当前标签的父级元素
console.log(a.parentElement);
ex:2.获取所有的子节点和子元素
var a = document.getElementById("id名称");
//在控制台输出
console.log(a.childNodes);
console.log(a.children);
ps:
1.children返回的是数组；
children[0];用下标来寻找对应的节点
2.节点中是可以包裹节点的
3.类似现实,子就是指儿子，是自己直接生出来的(标签下级直接包裹的标签)，而后代则是指儿子、孙子、曾孙、...，即辈分低于自己的所有都是后代(标签中包裹的所有标签)
遇到问题:
XML中有节点(Node)与元素(Element)两个概念区别?
解决:待解决
-----------------------------------------------------------------------
操作节点:
------------------------------------------------------------------------------------------------------------------
sessionStorage与localStorage的区别与详解:
主要区别sessionStorage与localStorage的生命周期不一样。
sessionStorage：浏览器关闭后其内部setItem的值会被自动删除
localStorage ：只要不手动清缓存或者removeItem,clear等操作。设置的值会一直存在，关闭浏览器后还会存在（前提是重新打开同样的网址）
(两种方式都属属于web storage)
web storage和cookie,session的区别：
Cookie(客户端)存储于访问者的计算机中的变量的大小是受限的，大概只允许4k
web storage（客户端） 缓存大小能到5m甚至更大。
这两者都是保存在浏览器端,且同源的
Session 在服务器端，默认被存在在服务器的一个文件里（不是内存），
Session的运行依赖 session id，而 session id 是存在 cookie 中的，也就是说，如果浏览器禁用了 cookie ，同时 session 也会失效
(但是可以通过其它方式实现，比如在 url 中传递 session_id），和sessionStorage不是同一概念的，值得注意。
暂时先简单了解
遇到问题:
1.节点搞清楚了,子节点和后代节点也搞清楚了,但子节点和子元素区别没搞清
收获:
1.了解部分节点概念,但没理清它和元素的区别
2.了解本地储存存在的意义,简略了解几种储存方式还有区别
同上
明日计划:继续js-3
返回列表
评论