Chr*_*org 3 javascript jquery mootools
我将为我的网站启动一个javascript报告引擎,并开始使用MooTools进行一些原型设计.我真的很喜欢能做这样的事情:
function showLeagues(leagues) {
var leagueList = $("leagues");
leagueList.empty();
for(var i = 0; i<leagues.length; ++i) {
var listItem = getLeagueListElement(leagues[i]);
leagueList.adopt(listItem);
}
}
function getLeagueListElement(league) {
var listItem = new Element('li');
var newElement = new Element('a', {
'html': league.name,
'href': '?league='+league.key,
'events': {
'click': function() { showLeague(league); return false; }
}
});
listItem.adopt(newElement);
return listItem;
}
Run Code Online (Sandbox Code Playgroud)
从我所看到的,jQuery的"采用"类型方法只采用html字符串或DOM元素.是否有任何jQuery等同于MooTools的元素?
从语法上讲,使用jQuery来做它可能更好,但它的使用效率可能更高
document.createElement('li')
Run Code Online (Sandbox Code Playgroud)
并且至少需要一个字符串比较测试和一个次要的令牌解析.
如果你坚持生成大量的dom节点,flydom也可能会引起你的兴趣.(理论上它应该更快,但还没有测试过)
注意:在内部,jQuery("<html> </ html>")看起来有效地做到了这一点(过于简化):
jQuery(matcher) --> function(matcher)
{
return jQuery.fn.init(matcher) --> function(matcher)
{
return this.setArray(
jQuery.makeArray(
jQuery.clean(matcher) --> function(matcher)
{
div = document.createElement('div');
div.innerHTML = matcher;
return div.childNodes;
}
)
);
}
}
Run Code Online (Sandbox Code Playgroud)
因此,人们会假设" document.createElement"因此是"要求",如果你知道你想要什么(即:不会将某些第三方数据与之相提并论$( datahere )),那么document.createElement就会有合理的逻辑和速度提升,以避免众多的正则表达式和缓慢的字符串操作.
相比之下:jQuery(document.createElement('div'))
看起来它有效地做到了这一点(过于简化):
jQuery(matcher) --> function(matcher)
{
return jQuery.fn.init(matcher) --> function(matcher)
{
this[0] = matcher;
this.length = 1;
return this;
}
}
Run Code Online (Sandbox Code Playgroud)