更多知识：
http://blog.csdn.net/cckevincyh/article/details/70198470
https://www.cnblogs.com/wkrbky/p/6228779.html
###iframe 标签
- iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。
- iframe元素也就是文档中的文档。
###window 对象
**浏览器会在其打开一个 HTML 文档时创建一个对应的 window 对象。**但是，如果一个文档定义了一个或多个框架(即，包含一个或多个 frame 或 iframe 标签)，浏览器就会为原始文档创建一个 window 对象，再为每个框架创建额外的 window 对象。这些额外的对象是原始窗口的 子窗口，可能被原始窗口中发生的事件所影响。例如，关闭原始窗口将导致关闭全部子窗口。如果想要创建新窗口(以及对应的 window 对象)，可以使用像 open, showModalDialog 和 showModelessDialog 这样的方法。
###IFrame对象的contentWindow 属性
- 定义：该属性返回的是iframe的window对象，所以后面可以接着调用document方法，再接着调用getElementByTagName。那么就可以对iframe里面的元素进行操作了。
- 语法：
iframeObject.contentWindow - 所有主要浏览器都支持 contentWindow 属性。
更多知识：http://blog.csdn.net/skydar/article/details/51207110
###Iframe对象的contentDocument 属性
- 定义：contentDocument 属性能够以 HTML 对象来返回 iframe 中的文档。
- 语法：
iframeObject.contentDocument
###各浏览器Iframe对contentWindow、contentDocument、document属性测试
更多知识：http://blog.csdn.net/xiaofanku/article/details/10202129
###pre标签
- 用途：可定义预格式化的文本，用来表示计算机的源代码 。
- 具体：被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
- pre 元素中允许的文本可以包括物理样式和基于内容的样式变化，还有链接、图像和水平分隔线。当把其他标签(比如 < a > 标签)放到 < pre > 块中时，就像放在 HTML/XHTML 文档的其他部分中一样即可。
- 提示:在 W3School 中，非常多页面中的源代码实例都是通过 < pre > 标签定义的，您可以参考这些页面，学习如何使用该标签。我们甚至把 < pre > 标签与 < code > 标签结合起来使用，以获得更加精确的语义。
###jQuery的最核心的函数
(
e
x
p
r
e
s
s
i
o
n
,
[
c
o
n
t
e
x
t
]
)
∗
∗
A
P
I
文
档
中
说
了
：
默
认
情
况
下
,
如
果
没
有
指
定
c
o
n
t
e
x
t
参
数
，
(expression, [context])** API文档中说了： 默认情况下, 如果没有指定context参数，
(expression,[context])∗∗API文档中说了：默认情况下,如果没有指定context参数，()将在当前的 HTML document中查找 DOM 元素；如果指定了 context 参数，如一个 DOM元素集或jQuery对象**，那就会在这个 context 中查找。在jQuery 1.3.2以后，其返回的元素顺序等同于在context中出现的先后顺序。
###jQuery ajax - ajaxError() 方法
ajaxError() 方法在 AJAX 请求发生错误时执行函数。它是一个 Ajax 事件。
语法：$(selector).ajaxError(function(event,xhr,options,exc))
event - 包含 event 对象
xhr - 包含 XMLHttpRequest 对象
options - 包含 AJAX 请求中使用的选项
exc - 包含 JavaScript exception
###在jQuery中，$相当于jQuery
$(“input”)相当于jQuery(“input”)
###jQuery 事件 - trigger() 方法
5. 语法：$(selector).trigger(event,[param1,param2,...])
6. 触发 input 元素的 myfunction 事件：
$("button").click(function(){ $("input").trigger("myfunction"); });
###src= javascript:false 是什么意思?
可能就是在进行加载的时候,把返回值设置为false,后面的操作就不再进行了。
###JavaScript eval() 函数
eval(String) 函数可计算某个字符串，并执行其中的的 JavaScript 代码。
###jQuery.extend()函数
5. 简介：是Jquery的扩展方法。
6. extend(dest,src1,src2,src3...);
它的含义是将src1,src2,src3…合并到dest中,返回值为合并后的dest,由此可以看出该方法合并后，是修改了dest的结构的。如果想要得到合并的结果却又不想修改dest的结构，可以如下使用：
var newSrc=$.extend({},src1,src2,src3...)//也就是将"{}"作为dest参数。
3.$.extend(src)
上述的extend方法原型中的dest参数是可以省略的，如果省略了，则该方法就只能有一个src参数，而且是将该src合并到调用extend方法的对象中去。
$.extend({
hello:function(){alert('hello');}
});
更多知识：http://www.cnblogs.com/RascallySnake/archive/2010/05/07/1729563.html
###jquery 如何定义全局变量
7. 在函数外部：var xxx='全局变量';
8. 在函数内部：var window.xxx='全局变量';
9. window["ss"]="a"; window["hh"]="b";
###JS中的call()和apply()方法
1.call方法:
语法：obj.error.call([thisObj[,arg1[, arg2[, [,.argN]]]]])
**定义：调用一个对象（比如obj）的一个方法（比如error），以另一个对象thisObj替换当前对象（obj）。 **
###JavaScript global 属性
- 语法
RegExpObject.global - 定义和用法
global 属性用于返回正则表达式是否具有标志 “g”。
它声明了给定的正则表达式是否执行全局匹配。
如果 g 标志被设置，则该属性为 true，否则为 false。
###JavaScript attachEvent()函数
- 语法：
obj.attachEvent(事件类型, 处理函数); - 用于HTML内代码层和UI层分离。
- 比如，给一个按钮增加一个单击事件
myBtn.attachEvent("onclick", myEvent);
function myEvent(e){ alert("点击了一下"); }
###JavaScript addEventListener()函数
- 语法：
obj.addEventListener(事件类型, 处理函数,参数值); - 具体作用与attachEvent()函数一样。
###ajaxStart和ajaxStop
是一种全局的配置。通常用来侦测页面中异步请求的发送/结束。
###(window.ActiveXObject)的作用
用来判断浏览器是否支持ActiveX控件。
ActiveX 控件是用于互联网的很小的程序，有时称为插件程序。它们会允许播放动画，或帮助执行任务，如在 Microsoft Update 安装安全更新，因此可以增强您的浏览体验。
ActiveX是Microsoft对于一系列策略性面向对象程序技术和工具的称呼，其中主要的技术是组件对象模型(COM)。在有目录和其它支持的网络中，COM变成了分布式COM(DCOM)。
###正则表达式
| 特别字符 | 描述 |
|---|---|
| . | 匹配除换行符 \n 之外的任何单字符 |
| ? | 匹配前面的子表达式零次或一次，或指明一个非贪婪限定符，等价于 限定符{0,1} |
| + | 匹配前面的子表达式一次或多次,等价于 限定符{1,} |
| $ | 匹配输入字符串的结尾位置。如果设置了 RegExp 对象的 Multiline 属性，则 $ 也匹配 ‘\n’ 或 ‘\r’ ， |
| [ | 标记一个中括号表达式的开始，如 /Chapter [1-9][0-9]*/ |
| \ | 将下一个字符标记为或特殊字符、或原义字符、或向后引用、或八进制转义符。例如， ‘n’ 匹配字符 ‘n’。’\n’ 匹配换行符。序列 '\ ’ 匹配 “”，而 ‘\ (’ 则匹配 “(” |
| { | 标记限定符表达式的开始 |
| 限定符 | 描述 |
|---|---|
| {n,} | n 是一个非负整数。至少匹配n 次。例如，‘o{2,}’ 不能匹配 “Bob” 中的 ‘o’，但能匹配 “foooood” 中的所有 o。‘o{1,}’ 等价于 ‘o+’。‘o{0,}’ 则等价于 ‘o*’ |
| {n,m} | m 和 n 均为非负整数，其中n <= m。最少匹配 n 次且最多匹配 m 次。例如，“o{1,3}” 将匹配 “fooooood” 中的前三个 o。‘o{0,1}’ 等价于 ‘o?’。请注意在逗号和两个数之间不能有空格 |
*、+限定符都是贪婪的，因为它们会尽可能多的匹配文字，只有在它们的后面加上一个?就可以实现非贪婪或最小匹配。
更多内容：http://www.runoob.com/regexp/regexp-syntax.html ###jQuery.extend({});
###JavaScript RegExp 对象
- 定义：RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具。
- 直接量语法：
/pattern/attributes - 创建 RegExp 对象的语法：
new RegExp(pattern, attributes); - 参数：参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。
参数 attributes 是一个可选的字符串，包含属性 “g”、“i” 和 “m”，分别用于指定全局匹配、区分大小写的匹配和多行匹配。
###JavaScript exec() 方法
1.定义： exec() 方法用于检索字符串中的正则表达式的匹配。
2. 语法：RegExpObject.exec(string)
3. 参数：string必需。是要检索的字符串。
4. 返回值：返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。
###JavaScript test() 方法
- 定义：一般用于校验文件的格式
- 语法：
正则表达式.test(String) - 参数：string必需。是要检索的字符串。
- 返回值：返回一个布尔值。
###ajaxFileUpload.js解析
jQuery.extend({
handleError : function(req, res, status, exception) {
console.log("请求失败！执行方法：handleError : function(req, res, status, exception)");
//如果req.error是存在的，则用新的req取代旧的req
if (req.error) {
req.error.call(req.context || req, res, status, exception);
}
// Fire the global callback
if (req.global) {
(req.context ? jQuery(req.context) : jQuery.event).trigger(
"ajaxError", [ res, req, exception ]);
console.log("执行ajaxError()方法");
}
},
//id为当前系统时间字符串，secureuri是外部传入的json对象的一个参数secureuri
createUploadIframe: function(id, secureuri)
{
console.log("创建不可见的iframe标签");
var frameId = 'jUploadFrame' + id; //给iframe添加一个独一无二的id
if(window.ActiveXObject) {//判断浏览器是否支持ActiveX控件
var iframe = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />');
if(typeof secureuri== 'boolean'){
iframe.src = 'javascript:false';
}
else if(typeof secureuri== 'string'){
iframe.src = secureuri;
}
}
else {
var iframe = document.createElement('iframe');
iframe.id = frameId;
iframe.name = frameId;
}
//不可见的iframe
iframe.style.position = 'absolute';
iframe.style.top = '-1000px';
iframe.style.left = '-1000px';
document.body.appendChild(iframe); //将动态iframe追加到body中
return iframe;
},
//id为当前系统时间字符串，fileElementId为页面<input type='file' />的id
createUploadForm: function(id, fileElementId)
{
console.log("创建不可见的form标签");
var formId = 'jUploadForm' + id;
var fileId = 'jUploadFile' + id;
var form = $('<form action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data"></form>');
var oldElement = $('#' + fileElementId); //得到页面中的<input type='file' />对象
var newElement = $(oldElement).clone(); //克隆页面中的<input type='file' />对象
$(oldElement).attr('id', fileId); //修改原对象的id
$(oldElement).before(newElement); //在原对象前插入克隆对象
$(oldElement).appendTo(form); //把原对象插入到动态form的结尾处
//不可见
$(form).css('position', 'absolute'); //给动态form添加样式，使其浮动起来，
$(form).css('top', '-1200px');
$(form).css('left', '-1200px');
$(form).appendTo('body'); //把动态form插入到body中
return form;
},
addOtherRequestsToForm: function(form,data)
{
console.log("添加新的请求数据data到表单中");
// add extra parameter
var originalElement = $('<input type="hidden" name="" value="">');
for (var key in data) {
name = key;
value = data[key];
var cloneElement = originalElement.clone();
cloneElement.attr({'name':name,'value':value});
$(cloneElement).appendTo(form);
}
return form;
},
//这里req是个json对象，传入一些ajax的参数
ajaxFileUpload: function(req) {
console.log("开始执行ajaxFileUpload(req),req是个json对象，传入一些ajax的参数");
req = jQuery.extend({}, jQuery.ajaxSettings, req); //此时的s对象是由jQuery.ajaxSettings和原s对象扩展后的对象
var id = new Date().getTime(); //取当前系统时间，目的是得到一个独一无二的数字
var form = jQuery.createUploadForm(id, req.fileElementId);//创建动态form
if ( req.data ) form = jQuery.addOtherRequestsToForm(form,req.data);//如果还有其他参数，则将req.data添加到表单中
var iframe = jQuery.createUploadIframe(id, req.secureuri); //创建动态iframe
var frameId = 'jUploadFrame' + id; //动态iframe的id
var formId = 'jUploadForm' + id; //动态form的id
//监视req
if ( req.global && ! jQuery.active++ )
{ //当jQuery开始发送一个ajax请求之前，触发ajaxStart()方法
jQuery.event.trigger( "ajaxStart" );
console.log("在 AJAX 请求发送前执行ajaxStart()方法");
}
var requestDone = false; //表示“请求完成”的一个标志
var res = {};
console.log("创建一个response对象：var res={}");
if ( req.global ){ //当 AJAX请求即将发送时，触发ajaxSend方法
jQuery.event.trigger("ajaxSend", [res, req]);
}
//回调函数，监视并获取响应
var uploadCallback = function(isTimeout)
{
var iframe = document.getElementById(frameId); //得到iframe对象
try
{
if(iframe.contentWindow)
{ //动态iframe所在窗口对象是否存在//pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体
res.responseText = iframe.contentWindow.document.body?iframe.contentWindow.document.body.innerHTML:null; //判断iframe的 body 是否是 定义状态，若为undefined，则xml.responseText赋值为null
res.responseXML = iframe.contentWindow.document.XMLDocument?iframe.contentWindow.document.XMLDocument:iframe.contentWindow.document; //判断iframe的 XMLDocument 是否是 定义状态，若为undefined，则xml.responseXML赋值为iframe的document对象
}else if(iframe.contentDocument)
{ //动态iframe的文档对象是否存在
res.responseText = iframe.contentDocument.document.body?iframe.contentDocument.document.body.innerHTML:null;
res.responseXML = iframe.contentDocument.document.XMLDocument?iframe.contentDocument.document.XMLDocument:iframe.contentDocument.document;
}
}catch(exception)
{
jQuery.handleError(req, res, null, exception);
}
if ( res || isTimeout == "timeout")//xml变量被赋值或者isTimeout == "timeout"都表示请求发出，并且有响应
{
requestDone = true; //请求完成
var status; //状态“超时”或“不超时”
try {
status = isTimeout != "timeout" ? "success" : "error"; //如果不是“超时”，表示请求成功
if ( status != "error" )
{
console.log("将json对象从<pre></pre>中取出来");
var data = jQuery.getDataByDataType(res,req.dataType ); //根据传送的type类型，返回json对象，此时返回的data就是后台操作后的返回结果
if ( req.success )
req.success( data, status ); //执行上传成功的操作
if( req.global )
jQuery.event.trigger( "ajaxSuccess", [res, req] ); //触发ajaxSuccess()函数
} else
jQuery.handleError(req, res, status); //触发handleError()方法
} catch(exception)
{
status = "error";
jQuery.handleError(req, res, status, exception);
}
// The request was completed
if( req.global )
jQuery.event.trigger( "ajaxComplete", [res, req] );
// Handle the global AJAX counter
if ( req.global && ! --jQuery.active )
jQuery.event.trigger( "ajaxStop" );
// Process result
if ( req.complete )
req.complete(res, status);
jQuery(iframe).unbind(); //移除iframe的事件处理程序
setTimeout(function(){ //设置超时时间
try
{
$(iframe).remove(); //移除动态iframe
$(form).remove(); //移除动态form
} catch(exception)
{
jQuery.handleError(req, res, null, exception);
}
}, 100);
res = null;
}
};
if(req.timeout>0)
{ //超时检测
setTimeout(function(){
if( !requestDone )
uploadCallback( "timeout" ); //如果请求仍未完成，就发送超时信号
}, req.timeout);
}
try{
console.log("设置表单的属性：action是$(form).attr('action', req.url); 提交方式是$(form).attr('method', 'POST');返回数据的目的地是$(form).attr('target', frameId);");
// var iframe = $('#' + frameId);
var form = $('#' + formId);
$(form).attr('action', req.url); //传入的ajax页面导向url
$(form).attr('method', 'POST'); //设置提交表单方式
$(form).attr('target', frameId); //返回的目标iframe，就是创建的动态iframe
if(form.encoding) //选择编码方式
{
form.encoding = 'multipart/form-data';
}
else
{
form.enctype = 'multipart/form-data';
}
$(form).submit();
console.log("提交表单：$(form).submit();");
} catch(exception)
{
jQuery.handleError(req, res, null, exception);
}
//调用onload()或load()函数加载uploadCallback方法
if(window.attachEvent){
document.getElementById(frameId).attachEvent('onload', uploadCallback);
}
else{ //如果没有执行window.attachEvent
document.getElementById(frameId).addEventListener('load', uploadCallback, false); //ajax 请求从服务器加载数据，同时传入回调函数
}
return {abort: function () {}}; //abort意为终止，此处终止该函数
},
getDataByDataType: function(res, dataType ) {
var data="0"; //初始化data
data = dataType == "xml" || data ? res.responseXML : res.responseText;
// If the type is "script", eval it in global context
if ( dataType == "script" )
jQuery.globalEval(data);//全局变量
// Get the JavaScript object, if JSON is used.
if ( dataType == "json" )
{
// If you add mimetype in your response,
// you have to delete the '<pre></pre>' tag.
// The pre tag in Chrome has attribute, so have to use regex to remove
var data = res.responseText; //res.responseText
var rx = new RegExp("<pre.*?>(.*?)</pre>","i"); console.log("正则表达式:"+rx);
var am = rx.exec(data); console.log("data中与正则表达式匹配的数据："+am);
//this is the desired data extracted
var data = (am) ? am[1] : ""; //the only submatch or empty
console.log(am[1]);
eval( "data = " + data );
//data = jQuery.parseJSON(jQuery(data).text());
}
if ( dataType == "html" )
jQuery("<div>").html(data).evalScripts();
return data;
}
});
