【金秋打卡】第21天 从函数到函数式编程之路
标签:
JavaScript
课程名称:破解JavaScript高级玩法
课程章节:第8章 被我们忽视的BOM
主讲老师:Cloud
课程内容:
今天学习的内容包括:
8-3 location对象几个重要的知识点——location上的属性和方法的使用。
课程收获:
了解location对象
- href:包含这个URL的DomString
- protocol:协议,一般为http:,https:
- host:主机名,包括端口
- hostname:主机名
- port:端口
- pathname:URL中路径部分,开头包含/
- search:URL参数DOMString,开头包含?
- hash:URL的hash部分,开头包含#
- username:URL域名前的用户名
- password:URL域名前的密码
- origin:页面来源,URL中?前部分
- assign():加载指定URL内容
- reload():重新加载当前页面
- replace():使用新页面替换当前页面
- toString():返回一个DOMString,包含整个URL
- searchParams:只读,访问search中各个查询参数
- createObjectURL():创建—个唯—的blob链接
- revokeObjectURL():销毁createObjectURL()创建的实例
可修改属性值
- protocol
- host
- hostname
- port
- pathname
- search
- hash
- href
修改属性值-注意点
- location.origin 属性是只读的,存在兼容问题(IE11以下不存在)
- 除hash,其他任意属性修改都会以新URL重新加载。修改这些属性值,会在浏览器的历史记录中生成一条新的历史记录
- 修改pathtname 不用传开头/, 修改search 不用传?,修改hash 不用传#
host vs hostname
- host 包含端口号
- hostname 只返回域名
- 没有端口号的URL,host 与 hostname 相同
访问Location 对象方式
- window.location
- document.location
- window.document.location
- location(不推荐)
window.location.reload
- 定义:重新加载当前文档
- 参数:false或者不传,浏览器可能从缓存中读取页面
- 参数:true,强制从服务器重新下载文档
assign vs href vs replace
- assign 和 href会增加一条新纪录
- replace不会增加
window.location.href vs window.open
- window.location.href 是用新的域名页调换当前页,不会开新窗口
- window.open用来打开新窗口或者查找已命名的窗口,打开新窗口可能会被浏览器拦截
hash-监听方式
- window.onhashchange = funcRef;
- window.addEventListener(“hashchange”, funcRef, false);
<body onhashchange="funcRef();">
location 修改 vs URL 修改 区别
- location 的属性修改直接反应在相关的对象上,浏览器触发当前地址栏更新。
- URL 的属性修改,仅仅是URL实例对象更改,不会触发浏览器的其他操作。
encodeURI ,encodeURIComponent系列
- 定义:都是编码URL,唯一的区别在于编码的字符范围不同。
- encodeURIComponent 不转义的字符: A-Z a-z 0-9 - _ . ! ~ * ’ ( )
- encodeURI不转义的字符:A-Z a-z 0-9 ; , / ? : @ & = + $ -_.!~*’() #
encodeURI ,encodeURIComponent使用场景
- 如果需要编码整个URL,然后需要使用这个URL,那么使用encodeURI
- 如果只需要编码URL中的参数,那么使用encodeURIComponent是最好的
今天 学习了 location对象几个重要的知识点。学习到了location相关API以及使用场景,了解到了encodeURL和encodeURLComponent的区别。对自己说一句,加油😀~
坚持打卡,坚持学习!明天见💪~
点击查看更多内容
为 TA 点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦