kongxh_1981的专栏

假设下面的这一段html中meta的两行配置。 这里面配置了charset和Content-Language。Content-Language：表示当前页面的语言。charset：表示编码字符集 任何一种语言可能都会对应有几种编码字符集。比如中文的编码字符集就有中国国家标准总局编制的GB2312，GB18

开发中，打断对象间的引用关系，只想下个副本的情况无处不在，clone一个对象就在所难免了。  JavaScript中，简单的方法就是用JSON函数，将对象stringify成字符串，再parse成一个新对象。要么就是从网上搜个代码，开源社区里面clone的代码还是有不少的。  代码虽然可以找得到，但，东西永远是别人的，动手学着码永远是个不变的主题。  自己写了两个克隆的函数

通过一个demo测试这三个属性的差别。说明：scrollWidth：对象的实际内容的宽度，不包边线宽度，会随对象中内容超过可视区后而变大。 clientWidth：对象内容的可视区的宽度，不包滚动条等边线，会随对象显示大小的变化而改变。 offsetWidth：对象整体的实际宽度，包滚动条等边线，会随对象显示大小的变化而改变。 该demo就在页面中放一个te

如果需要将id是‘div2js’的div元素删除。1.使用DOM对象首先需要找到被删元素的父元素，通过父元素将其需要删除的子元素删除。var el = document.getElementById('div2js');el.parentNode.removeChild(el); 2.使用JQuery直接找到并删除。$('#div2js'

页面初始化中，用的较多的就是$(document).ready(function(){//代码}); 或 $(window).load(function(){//代码});他们的区别就是，ready是在DOM的结构加载完后就触发，load是在页面内包括DOM结构，css，js，图片等都加载完成后再触发，显然ready更适合作为页面初始化使用。但有时候也不尽然。需要进一步查看其内部机制。

看了javascript网页特效实例大全中的图片飘下的效果实例，觉得值得动手学习下。就把图片改成雪花图，完成一个雪花飘下的效果。并且，其中有些内容比较陈旧了，那么就学者改掉吧。包括：1.对left和top的操作仅支持IE浏览器，这咋行，必须得支持chrome。2.控制图片下落的过程还要去检索element，不好吧，那就改成数组维持，直接操作数组中维持的对象，

如果我要创建一个div元素。1.使用DOM对象创建：使用document.createElement('div')方法创建元素。 2.使用JQuery创建：使用$('通过JQuery创建的新元素')的方法直接创建元素。

在javascript中，几种数据类型String，Number，Boolean，Object，Function都是函数，可称之为函数对象。可以说拥有prototype属性的都是函数。所有对象都拥有__proto__属性，因为原型链就是靠__proto__的指向进行构建。使用函数，并在该函数前添加new操作符的调用，可构建一个对象，如：function Foo()

数组：var arr = [1, 2, 3, 5, 6];传统的教科书式的循环写法：for(var i=0; i; i++){ console.log(arr[i]);}简化版：for(var i= 0, t; t=arr[i++];){ console.log(t);} 条件表达式部分只要判断为假就会退出循环，只要条件表达式的结果是null

html： 被替换的元素1.使用DOM对象添加元素var elemOld = document.getElementById('divBeReplaced');var elemParent = elemOld.parentNode;var elemNew = document.createElement('div');elemNew.innerHTML = '新

html： 1.使用DOM对象添加元素var el = document.createElement('div');el.innerHTML = '用DOM添加的元素';var elContainer = document.getElementById('divContainer');elContainer.appendChild(el); 2.使用

在javascript设计模式实践之代理模式--图片预加载中用代理模式实现了图片预加载功能。现在就更进一步，完成一个能够一张一张的连续图片加载的功能。功能：1.一张一张加载图片。2.加载错误，超时后显示加载失败图片。对于功能的要求，肯定会存在对加载状态事件的处理以及完成时回调函数的处理，这样不仅会造成代码上的混乱，甚至破坏各种原则，就不再用普通的方法去写了。

概念块级：block内联：inline内联块级：inline-block 在html元素中，元素会有display属性display属性默认值是block，那么该元素是块级元素。display属性默认值是inline，那么该元素是内联元素。没有元素的display默认值是inline-block。display属性值可以被设置

标签包含了页面文档的上下文信息。主要包含的上下文信息：1.配置了服务器向浏览器响应时，http协议的head信息，浏览器根据head执行相应操作。2.对页面的描述信息，便于搜索引擎分类查找。 在 HTML 中， 标签没有结束标签。在 XHTML 中， 标签必须被正确地关闭。 标签必选的属性是content。标签可选的属性是name

现在的网页中显示很多图标算是常态，发现项目中页面上用到的图标都是单个图标单个文件，用的时候直接往页面上挂，这确实很常态。如果，网站是挂在外网上，或者网速过低，又大量使用图标的情况下，由于浏览器和服务器的并发连接数是受限的，通常是4~8个，那么图标显示过慢或者超时的情况就会发生。当然了，像采用CDN，或者按照浏览器的并发数对图片文件进行域名分散存储处理也是再好不过的，但不是都有这样的

IE下默认会开启缓存策略，不管是页面还是通过ajax请求的数据都会议一个url，url是uri（统一资源定位符）的实例，url就是资源的标识符。写一个demo进行验证，测试环境：IE8，node.js 0.12.7，页面模板为jade。 页面代码：testCache.jade页面上放一个按钮，点下后从后台获取一个自增的数值显示在按钮上。doctype htm

毛玻璃其实就是磨砂玻璃，能够模糊的看清背后的风景，让人感觉有种朦胧美，让界面看上去有些层次感。比如：高大上啊，接下来肯定是眼馋手痒的过程。。。当然，用ps搞一个全景毛玻璃背景毫无疑问是最省事的，那接下来就没啥事可干了。当然no no no了。毛玻璃无疑就是种模糊了，少不了filter blur。最终效果（chrome）：天气预

在javascript中，我们调用对象变量的某个方法之前，经常会向下面的代码一样判断该对象是否存在，该变量定义过并且值不是null的话就调用相应的方法。if (typeof p !== "undefined" && p !== null) { p.sayHello();}到了CoffeeScript中，上面的代码直接被简化成：p?.sayHello()意思就是变量p定义且被实

检测对象中属性的存在与否可以通过几种方法来判断。1.使用in关键字。该方法可以判断对象的自有属性和继承来的属性是否存在。var o={x:1};"x" in o; //true，自有属性存在"y" in o; //false"toString" in o; //true，是一个继承属性2.使用对象的has

标签必须放在整个html文档的第一行，之后一行就是从标签开始，所有浏览器都支持标签。标签是用来告诉浏览器用哪个html版本解析当前的html页面。其中很多DOCTYPE中都带有DTD声明，DTD就是html文档的规范说明，主要有：strict（严格）、transitional（过度）、frameset（框架），严格类型的DTD包含了大部分的html元素和属性，但一些过时的元素已经不

第一个参数第二个参数（可选）slice()开始位置需要返回的子字符串最后一个字符后面的位置substr()开始位置需要返回的字符个数substring()开始位置需要返回的子字符串最后一个字符后面的位置

在javascript中有两种函数的定义法：函数声明，函数表达式。函数声明：function doSomthing(){ return "hello"; }函数表达式：var f1 = function doSomthing(){ return "hello";};函数声明和函数表达式在执行效果上是等价的，但是解析器在向执行环境

Math对象中有3个方法用于处理小数值的舍入操作，它们是：Math.ceil()、Math.floor()、Math.round()。Math.ceil()：向上舍入为最接近的整数。Math.floor()：向下舍入为最接近的整数。Math.round()：标准的四舍五入。alert(Math.ceil(3.2)); // 4alert(Math.ceil(3

创建对象，可以通过字面量、关键字new，Object.create()函数创建。　　1.字面量。var o1={ name:"kxh", deal:function(){ 　　return this.name; 　　} }2.关键字new。var o4=new Object();o4.name="kxh1";o4.deal=f

越是基础的东西，越容易被忽视，接下来就来一道小题，看看我们掌握了没。for(i=0, j=0, l=0; i<10, j<11, l<14; i++, j++, l++){ a = i + j;}上面这段代码执行后，变量“a”的结果是什么？，代码不存在任何错误。答案在下面。。。。。。。。。。。

在要排序的一组数列中，选出最小（或者最大）的一个数与第1个位置的数交换；然后在剩下的数当中再找最小（或者最大）的与第2个位置的数交换，依次类推，直到第n-1个元素（倒数第二个数）和第n个元素（最后一个数）比较为止。function sort(elements){ for(i = 0; i < elements.length; i++){ //将当前位置作为关键位置（最小位置）

假设我们用一个数组保存一组学生的基本信息。var studentsData = [{name:"mike",age:17}, {name:"loren",age:16}, {name:"frank",age:18}];现在，我们需要对这个数组按照姓名（name）字段进行升序排序，在这个场景内，使用数组的sort(compareFunction)方法

正则表达式：((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?) ((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)红色块代表：第一个字符是2，第二个字符是0到4，第三个字符是任意一位数字。表示200~249。

将n个元素的数列分为已有序和无序两个部分。数列：{a1，a2，a3，a4，…，an}将该数列的第一元素视为有序数列，后面都视为无序数列：{{a1}，{a2，a3，a4，…，an}}将无序数列中的元素插入到有序数列的对应位置，插入前通过比大小的方式找到其在有序数列中的对应位置。 代码：以下代码在nodejs环境中执行通过。functio

取一个小于n的整数作为第一个增量，把序列分组。所有距离为增量的倍数的元素放在同一个组中。先在各组内进行直接插入排序；然后，取第二个增量（第二个 一般的初次取序列的一半为增量，以后每次减半，直到增量为1。 以下代码在nodejs中执行通过。function shellInsertSort(elements, di){ //从增量的所在位置开始 for(

堆排序分为两个过程：1.建堆。堆实质上是完全二叉树，必须满足：树中任一非叶子结点的关键字均不大于（或不小于）其左右孩子（若存在）结点的关键字。堆分为：大根堆和小根堆，升序排序采用大根堆，降序排序采用小根堆。如果是大根堆，则通过调整函数将值最大的节点调整至堆根。2.将堆根保存于尾部，并对剩余序列调用调整函数，调整完成后，再将最大跟保存于尾部-1（-1，-2，.

比较相邻的元素。如果第一个比第二个大，就交换他们两个。对每一对相邻元素作同样的工作，从开始第一对到结尾的最后一对。在这一点，最后的元素应该会是最大的数。针对所有的元素重复以上的步骤，除了最后一个。持续每次对越来越少的元素重复上面的步骤，直到没有任何一对数字需要比较。function sort(elements){ for(var i=0;i<elements.length-1;

快速排序是对冒泡排序的一种改进。通过一趟排序将要排序的数据分割成独立的两部分，其中一部分的所有数据都比另外一部分的所有数据都要小，然后再按此方法对这两部分数据分别进行快速排序，整个排序过程可以递归进行，最终达到整个数据变成有序序列。假设要排序的数组是A[0]……A[N-1]，首先任意选取一个数据（通常选用数组的第一个数）作为基准数据，然后将所有比它小的数都放到它前面，所有比它大的数都放到它

写javascirpt代码时，typeof和instanceof这两个操作符时不时就会用到，堪称必用。但是！使用它们总是不能直接的得到想要的结果，非常纠结，普遍的说法认为“这两个操作符或许是javascript中最大的设计缺陷，因为几乎不可能从他们那里得到想要的结果”typeof说明：typeof返回一个表达式的数据类型的字符串，返回结果为js基本的数据类型，包括number,bo

完成简单的透明度控制功能使用filter的功能对图片元素进行透明度控制。支持IE8，Chrome浏览器。 /*透明20%*/ .opacity-20 { filter:alpha(opacity=20); /*支持IE浏览器的filter*/ -webkit-filter:opacity(0.2); /*支持chrome浏览器filter*

很多场合，我们都会调用jQuery的插件去完成某个功能，比如slider。如下图，做一个div，通过“$( "#slider" ).slider();”的方式直接将div变成slider，比起slider($('#slider'))更贴近jQuery的链式调用写法，可读性和通用性更好些。 那么，我们也来为jQuery写插件。便于项目中的组件化。方法是非常简单