『 Web Front-End、HTML5、DotNET 』『QQ交流群: 21789680(前端) 103929812(HTML5 Game)』
Core code
~ function(win) {
var jsLoader = {
debugMode: false,
list:[],
loadScripts : function() {
var me = this;
var jsList = me.list;
if(jsList.length == 0)
return;
var fn = arguments.callee;
var url = jsList[0];
if(this.debugMode){
//inject script to head tag, and can debug all scrips in developer tools
var head = document.getElementsByTagName("head")[0] || document.documentEl
HTML Application
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta http-equiv="x-ua-compatible" content="ie=9">
<hta:application id="ohta"
applicationname="myapp"
border="none"
borderstyle="normal"
caption="no"
icon="graphics/face01.ico"
maximizebutton="no"
minimizebutton="no"
showintaskbar="no"
singleinstance="no"
sysmenu="no"
version="1.0"
windowstate="normal"
contextmenu="no"
>
&n
我们使用AJAX一般使用get或post方式给Server传递data，一些情况下使用XHR的request header传递data也同样方便，比如传递个状态，或者时间戳。下面是jQuery中的设置AJAX request header方法：
(function($){
$.ajax({
url:'response.aspx',
headers:{
"fromeAjax" : "true" //set response header
},
success:function(){}
});
})(jQuery);
或
(function($){
$.ajax({
url:'response.aspx',
beforeSend:function(xhr){
xhr.setRequestHeader( "fromeAjax" , "true");
},
success:function(){}
});
})(jQuery);
Server端获取headers方法（C#为例）：
Request.header["fr
Java和C#中都存在，super和base关键字，可以快捷调用继承类的方法。而JS native在原型继承中却没有提供类似的功能，若自己实现这个功能，需要找到继承类prototype中的同名方法，代码中会出现class函数名等hardcode影响通用性。参考了extjs4中的callParent方法，给出如下解决方法：
(function(GBL) {
var ClassBase = function() {};
GBL.ClassHelp = {
extProto : function(fnClass, oExt, bOverride) {
var oBase = fnClass.prototype;
for(var i in oExt) {
if(!bOverride && oBase.hasOwnProperty(i))
continue;
if( typeof oExt[i] === 'function') {
oExt[i].$class = fnClass; &
公司的一个项目是依赖jQuery的，要求可以给第三方订阅。有点像google地图、淘宝广告一样可以被第三方使用。
这样就有一个问题：如果第三方site的页面，也用了jQuery怎么办，多个jQuery文件window.jQuery、window.$会被最下面的jQuery覆盖，如果jQuery版本不一样，也可能相同的方法有差异，这样就会造成第三方用jQuery的代码出现问题。
jquery的noConflict方法可以解决这个问题（返回值为jquery对象，相当于给jquery定义了一个别名），只不过需要每次引入jquery脚本的时候，都要紧跟jquery库下面使用这个方法。如果第三方没有使用这个方法怎么办？下面举个例子，假设第三方用的是jquery1.4.2，我们用的是jquery1.7.1。
我们可以在jquery1.7.1代码最上方，加入代码：
window.jQuery && window.$ && (window.$__ORGL__$ = $.noConflict());
$__ORGL__$：为第三方页面存在的jquery对象的别名，因为是全局变量，所以起得长一点，不容易引起冲突。
然后在jquery1.7.1代码最下方加入代码：
window.$__CURRENT__$ = $.noConflict();
window.jQuery = window.$ = window.$__ORGL__$ ? window.$__ORGL_
在我们使用一个庞大的js库（如：extjs），或者在我们的程序release压缩成一个文件之前，一个比较麻烦的事就是一个page要引用n个有序有依赖的js脚本文件，以下方法可以有效的解决这个问题。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>load</title>
<script type="text/javascript" src="../lib/jquery/jquery-1.4.2.js"></script>
</head>
<body>
<script>
var jsList = ['1.js', '2.js','3.js','4.js'];
;~ function() {
if(jsList.length == 0)
return;
var fn = arguments.callee;
focusin/focusout 支持事件冒泡，因此可为其实现事件代理。
<div id="testFocus" tabindex="-1">
<input id="ipt1" type="text" />
<input id="ipt2" type="text" />
</div>
<script type="text/javascript">
var tf = $('#testFocus');
tf.focus();
var focusin;
tf.bind({
'focusout' : function(e) {
focusin= false;
var $this = $(this);
setTimeout(function() {
if(focusin !== true) {
$this.hide();
}
}, 0);
},
&n
.tip{
border-style: solid;
border-color: #DCDFDF transparent;
border-width: 0 8px 10px;
width:0;
height:0;
}
<div class="tip"></div>
【三个因素】
1.border-top-width:0
2.border-left,border-right 要有宽度，并且颜色要透明
3.width:0决定左右边框能靠到一起形成三角形
定制三角形角度：设置 左右底边 宽度
同理：在左边的tip设置border-top:0 transparent solid;height:0
【其他方法】
控件（Control） 组件（Component） 模块（Module）
1. 组件与控件
组件是指实现接口的一个类或直接或间接派生的类，.通常用于可重复使用并且可以和其他对象进行交互的对象。按照一定的标准接口调用而被封装的类，那它就可称为组件。一个大的组件，可能还包含更小的组件。
控件是提供（或实现）用户界面功能的，有比较明显的界面表现的，或有一定交互功能的组件。每个控件都是一个组件，但并不是每个组件都是控件。
如DotNet Framwork中：
所有的Component实现了System.ComponentModel.IComponent接口。
所有的Control继承自System.Windows.Forms.Control与 System.Web.UI.Control类 ，而System.Windows.Forms.Control与 System.Web.UI.Control 则实现了System.ComponentModel.IComponent接口。
参考：http://msdn.microsoft.com/zh-cn/library/0b1dk63b(v=VS.80).aspx
2. 组件与模块
组件和模块，都是基于功能划分的单位，模块可以由多个组件构建。
组件强调的是＂跨项目的可重用性＂是为了可重用而开发的
模块用于在具体项目中划分相对独立的功能，模块则至少有一个组件组成，更偏重从逻辑上区分。模块的覆盖范围要比组件更大一些，它可能有多个组件组成。
自己想封装一个logger类调用console方法的时候能打出时间、模块名称等额外的info，而IE console下的方法不支持call、apply调用，也不能直接给console.info等方法设置call方法，很麻烦。。。
可以利用Function.apply、Function.prototype.apply、Object.apply等方法代替：
Function.apply.apply(consloe.info, [console, aArgs]);
or
Function.apply.call(consloe.info, console, aArgs);
注：其中aArgs为数组
function doLog(sMethod , aArgs){
if(navigator.userAgent.toLowerCase().indexOf('msie') > -1){
Function.apply.apply(console[sMethod], [console, aArgs]);
}else{
console[sMethod].apply(console,aArgs);
}
}
var Logger=function(sModule){
this._name=sModule;
};
var methods=['log','debug','info','error','warn'];
for(var i=0,len=methods.length; i<len; i++){
(function(method){
Logger.prototype[method]=function(){
var sDate='['+ new Date().toLocaleString()+']';
var aArgs=Array.prototype.slice.call(arguments,0);
aArgs.unshift(sDate);
aArgs.push('('+ this._name+')');
