随笔分类 - web前端
摘要：前言 Http 缓存机制作为 web 性能优化的重要手段，对于从事 Web 开发的同学们来说，应该是知识体系库中的一个基础环节，同时对于有志成为前端架构师的同学来说是必备的知识技能。 但是对于很多前端同学来说，仅仅只是知道浏览器会对请求的静态文件进行缓存，但是为什么被缓存，缓存是怎样生效的，却并不是
阅读全文
摘要：这些都是基础知识，不过有必要做深入了解。先简单介绍一下。 二者的定义： 当你在浏览网站的时候，WEB 服务器会先送一小小资料放在你的计算机上，Cookie 会帮你在网站上所打的文字或是一些选择， 都纪录下来。当下次你再光临同一个网站，WEB 服务器会先看看有没有它上次留下的 Cookie 资料，有的
阅读全文
摘要：浏览器兼容性问题一： 不同浏览器的标签默认的外补丁和内补丁不同（margin和padding） 问题症状：随便写几个标签，不加样式控制的情况下，各自的magin和padding差异较大。 解决方案：css里 *{margin:0;padding:0;} 浏览器兼容性问题二： 块属性标签float后，
阅读全文
摘要：CDN 的全称是 Content Delivery Network ，也就是内容分发网络。 目的是从技术上来提高用户访问网站的响应速度，解决Internet网络拥塞状况，是用户访问不至于受限于网络宽带小，用户访问量大、应用网点分布不均等问题的影响。 原理：在现有的Internet中增加一层新的网络架
阅读全文
摘要：表现与数据分离： 也可以说是界面与数据分离，要体现在代码上，操作数据的代码和操作界面的代码，要分开写。 优势：当页面需求发生改变，只需要改写界面的代码，并且修改的代码不能影响到操作数据访问的代码。 例如： <script> $(function () { var Countries = functi
阅读全文
摘要：解释： 1. 内联样式表的权值最高 1000； 2. ID 选择器的权值为 100 3. Class 类选择器的权值为 10 4. HTML 标签选择器的权值为 1 5 继承样式的权值为0.1(某些论文提出，但毫无疑问它的权值是最低的) 根据以上定义，所以我特意在选择器中尽可能详细的寻找所需要改变样
阅读全文
摘要：var str='assshghrhhdaa';var obj={};for(var i=0,l=str.length,k;i<l;i++){ k=str.charAt(i); if(obj[k]){ obj[k]++; }else{ obj[k]=1; }}var m=0;var i=null;f
阅读全文
摘要：优势：隐式函数（自调函数）里面的参数不会与其它框架的全局变量冲突。 js中常常定义一个函数用做临时的命名空间，在这个命名空间内定义的变量都不会污染到全局命名空间（防止局部变量与全局变量冲突） 普通写法： function mymodule(){ //模块代码 } mymodule(); 匿名自调函数
阅读全文
摘要：js的函数调用会免费奉送两个而外的参数就是 this 和 arguments 。arguments是参数组，他并不是一个真实的数组，但是可以使用.length方法获得长度。 书上有说4中调用方式： 方法调用模式 函数调用模式 构造器调用模式 apply调用模式 下面我们来看看一些实例更好理解。 1：
阅读全文
摘要：1、通过ID选取元素（getElementById） 1）使用方法：document.getElementById("domId") 其中，domId为要选取元素的id属性值 2）兼容性：低于IE8版本的IE浏览器对getElementById方法的实现是不区分元素ID号的大小写的，并且会返回匹配n
阅读全文
摘要：a:link {color: #FF0000} /*未访问状态*/a:visited {color: #00FF00}/*已访问状态*/a:hover {color: #FF00FF}/*鼠标移入到元素上面时的状态*/ a:active {color: #0000FF}/*鼠标按下状态状态*/
阅读全文
摘要：1、将行内元素a标签设置为块级元素或者是行内块（display:black;display:inline-black） 2、设置为浮动元素（float:left），有可能会因为浮动效果，覆盖其他元素 3、利用padding值模拟，将元素撑宽。
阅读全文
摘要：块级元素例如div等同时使用float浮动布局和设置margin-left或right时IE6出现的距离是设置值的两倍。解决：将此块级元素设置成行内元素：display:inline即可
阅读全文
摘要：基本数据类型：Number，String，Boolean，null，undefined（5个） 引用数据类型：Array，RegExp，Date，Function（4个）都属于boject类型 *判断某变量是否是数组（Array）数据类型：ECMA5 中定义了新方法：arr.isArray()
阅读全文
摘要：基本特点： 1、是一种解释性脚本语言（代码不进行预编译）。 2、主要是用来向html页面添加交互行为（可以直接嵌入html页面，也可以单独写成文件，结构和行为分离）。 3、跨平台特性，在绝大多数浏览器的支持下，可以在多个平台下运行（windows，Linux，Mac、Android、iOS）
阅读全文
摘要：window.onload:（原生的）是在dom文档加载完和所有文件加载完之后，执行一个函数。 只能在页面中出现一次。 document.ready:（jQuery库的入口函数）是在dom树加载完后执行的一个函数。 可以在页面中出现多次。
阅读全文
摘要：<header>定义文档的页眉<nav>定义导航链接的部分 <article>定义外部的内容，可以是一篇新的文章<section>定义文档的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。 <aside>定义article以外的内容，aside的内容可用作文章的侧边栏 <figu
阅读全文
摘要：1、onclick添加事件不能绑定多个事件，后面绑定的会覆盖前面的。 2、addEventListener方式，不支持低版本IE。 3、普通方式绑定事件后，不可以取消；addEventListener绑定后，可以用removeEvenListener 取消
阅读全文
摘要：1、图片懒加载：在页面的未可视区域，可以添加一个滚动条事件，判断图片到浏览器顶端的距离如果小于到低端的距离，优先加载。 2、图片预加载技术：如果为幻灯片，相册等，将当前展示图片的前一张和后一张优先下载。 3、其他技术：如果是css图片，可以使用CSSsprite，SVGsprite，Iconfont
阅读全文
摘要：DNS缓存：短时间内多次访问某个网站，在限定时间内，不用多次访问DNS服务器。 CDN缓存：内容分发网络（人们可以在就近的代售点取火车票了，不用非得到火车站去排队） 浏览器缓存：浏览器在用户磁盘上，对最新请求过的文档进行了存储。 服务器缓存：将需要频繁访问的Web页面和对象保存在离用户更近的系统中，
阅读全文
浙公网安备 33010602011771号