前端小知识

小知识一：

报错：Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

翻译：跨源请求只支持协议方案:http、data、chrome、chrome-extension、https、chrome-extension-resource。

问题：这是ajax请求本地文件时出现的跨域问题。

跨域问题：为什么要跨域？因为浏览器有同源策略。什么是同源策略?同源是指请求的协议、IP地址和端口都一样，比如说http://www.hahaha.com:8090/index1.html与http://www.hahaha.com:8090/index2.html就属于同源；http://www.hahaha.com:8090/index1.html与https://www.hahaha.com:8090/index1.html就不属于同源。同源策略的目的是什么呢？可想而知，如果没有同源策略，假如你打开了一个A网站，又打开了一个B网站，B网站就可以访问你的A网站，如果你在A网站中输入用户名和密码（被cookie保存），那么就会被B网站给获取到了以至于造成信息泄露，所以我们要感谢同源策略，它是浏览器最基本的安全机制，当然并不是说同源策略是非常安全的，只要对方下的成本够大，照样可以攻击你，俗话说没有刺不破的盾。同源策略将所有的外人都拒之门外，有些是坏人，而有些是好人，比如说自己写的前端程序去调用自己写的后台，那就需要通过跨域来解决这个wen

解决：1.WebStorm的IDE可以解决这个问题，也就是说使用WebStorm打开的项目不会出现这个问题。

          2.在谷歌快捷方式上鼠标右键，选择快捷方式这个导航条，然后在目标的后面输入 --allow-file-access-from-files，注意前面有个空格。

3.若方法2不行，找到谷歌浏览器的安装位置，按下shift+鼠标右键，点击“在此处打开命令窗口”，在命令行中输入start chrome.exe --allow-file-access-from-files

4.再或者将项目部署到网站中。首先打开控制面板，选择小图标，点击管理工具，点击Internet 信息服务(IIS)管理器，然后创建一个网站即可，注意这个项目文件最好放在任一磁盘的根目录下。

小知识二：

form表单里的button标签默认type为submit，而submit点击后会出现页面刷新的现象，为了避免这种现象，可以将button标签的type改为button即可。

小知识三：

布局好的页面在浏览器窗口变小的时候会乱，怎么回事？

打开百度，F12后会看的整个页面是有个宽度的。如下图所示。即给页面最外容器加个width就行了。

这个min-width、width、max-width的区别是什么呢？

width是把宽度写死了，min-width和max-width的宽度是根据子元素会发生变化的。怎么变？比如：max-width:750px;
小于或包括750px（内）的变化。min-width:320px包括和大于320px（外）的变化。

5.js中的函数可以声明function test(){}，也可以定义var test=function(){}。声明的可以在声明前调用，定义的必须在定义后调用。

6.不同网页之间传值：在A网页中向B网页跳转的时候，在B.html后面加"?index"=0就代表将index：0这个键值对传入的B网页中了，如：  window.location.href = "B.html" + "?index=" + 0;再在B网页中通过 let url = location.search来获取到传入的URL，对该URL进行处理即可得到最后的键值对。

7.localStorage是HTML5新增的一个特性，用于本地存储。let db=window.localStorage；db.setItem("test","123");用于添加数据，db.getItem("test")用于获取数据。前端同样用于存储的有cookie和sessionStorage。cookie：大小为4k，失效时间可以设置；localStorage：大小一般为5m，除非删除否则永久有效；sessionStorage：大小一般为5m，仅在当前会话下有效，关闭页面或浏览器后被清除。之前的网站中在下次登录时记住自己的账户和密码用的就是cookie

8.post与get请求的区别：get：get请求是向服务器获取数据，get请的参数求是将键值对序列附加到url上的，所以大小受url的长度限制，不能大于2kb，并且能够看见，安全性低；post：post请求是向服务器发送数据做修改，请求的参数放在请求体中，安全，并且大小不受限制。