如果像上一篇文章使用基于Jquery的可视化编辑器 Xheditor 那样设置的话，访问页面时会加载70多k的jquery文件和50多k的xheditor文件，为了追求页面默认加载的性能提升，其实这些文件完全可以在编辑的时候异步加载的，下面是操作步骤：

1，需要用到一个异步加载js文件并执行的函数

function getJsFile(url, callBack){

var XH = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject('Msxml2.XMLHTTP');

XH.open('get',url,true);

XH.onreadystatechange = function(){

if(XH.readyState == 4 && XH.status == 200){ if(window.execScript) window.execScript(XH.responseText);

else eval.call(window, XH.responseText);

eval(callBack);

}

}

XH.send('');

}

第一个参数url为js路径，第二个回调函数是加载完js之后的操作

2，由于我采用js初始化编辑器的方式，并且我把初始化的内容统一放到一个js文件以便以后统一更改样式，所以我异步加载的时候会加载三个文件。使用以下代码：

function callback(){ };

var is_load;

is_load = false;

function loads(){

if(!is_load){

getJsFile('/js/jquery-1.4.2.min.js','callback');

getJsFile('/js/editor/xheditor-en.min.js','callback');

getJsFile('js/editor/editor.js','callback');

is_load = true;

}

}; 回调函数留空，变量is_open判断是否已经加载过，防止重复加载

3，在textera框外面加一层span ,onclick="loads()"

大功告成了，只要一点击textarea就会调用js并且执行

不过有一点需要注意的是，由于xheditor默认是根据 页面这一条语句去判断插件所在的位置，由于采用异步加载所以网页头部没放这一行，解决的方法是在插件目录在建一个js文件，叫xheditor-autoload.js,刚好把上面那个 getJsFile()函数放进去，然后在放到页面头部位置： ，大小不到1k，算可以接受。