两个问题
1.jquery的链式操作是如何实现的?
2.为什么要用链式操作?
大家认为这两个问题哪个好回答一点呢?
链式操作
原理相信百度一下一大把,实际上链式操作仅仅是通过对象上的方法最后
return this
把对象再返回回来,对象当然可以继续调用方法啦,所以就可以链式操作了。那么,简单实现一个:
. 代码如下:
//定义一个js类
function demo() {
}
//扩展它的prototype
demo.prototype ={
setname:function (name) {
this.name = name;
return this;
},
getname:function () {
return this.name;
},
setage:function (age) {
this.age = age;
return this;
}
};
////工厂函数
function d() {
return new demo();
}
//去实现可链式的调用
d().setname("cj").setage(18).setname();
. 代码如下:
document.getelementbyid("ele").omething();
document.getelementbyid("ele").dootherthing();
. 代码如下:
var ele = document.getelementbyid("ele");
ele.dosomething();
ele.dootherthing();
. 代码如下:
var result = (new biginteger("31415926535")).multiply(new biginteger("4")).subtract(new biginteger("271828182")).val();
console.log("result == " + result);
. 代码如下:
var biginteger = new biginteger("31415926535");
var result1 = biginteger.multiply(new biginteger("4")).val();
var result2 = biginteger.subtract(new biginteger("271828182")).val();
console.log("result1 == " + result1 + ", result2 == " + result2);
. 代码如下:
function f(num, callback){
if(num<0) {
alert("调用低层函数处理!");
alert("分数不能为负,输入错误!");
}else if(num==0){
alert("调用低层函数处理!");
alert("该学生可能未参加考试!");
}else{
alert("调用高层函数处理!");
settimeout(function(){callback();}, 1000);
}
}
. 代码如下:
function eventtarget(){
this.handlers = {};
}
eventtarget.prototype = {
constructor: eventtarget,
addhandler: function(type, handler){
this.handlers[type] = [];
},
fire: function(){
if(!event.target){
event.target = this;
}
if(this.handlers[event.type instanceof array]){
var handlers = this.handlers[event.type];
for(var i = 0, len = handlers.length, i < len; i++){
handlers[i](event);
}
}
},
removehandler: function(type, handler){
if(this.handlers[type] instanceof array){
var handlers = this.handlers[type];
for(var i = 0, le = handlers.length; i < len; i++){
if(handlers[i] === handler){
break;
}
}
handlers.splice(i, 1);
}
}
};
. 代码如下:
(function(){
var isready=false; //判断ondomready方法是否已经被执行过
var readylist= [];//把需要执行的方法先暂存在这个数组里
var timer;//定时器句柄
ready=function(fn) {
if (isready )
fn.call( document);
else
readylist.push( function() { return fn.call(this);});
return this;
}
var ondomready=function(){
for(var i=0;i<readylist.length;i++){
readylist[i].apply(document);
}
readylist = null;
}
var bindready = function(evt){
if(isready) return;
isready=true;
ondomready.call(window);
if(document.removeeventlistener){
document.removeeventlistener("domcontentloaded", bindready, false);
}else if(document.attachevent){
document.detachevent("onreadystatechange", bindready);
if(window == window.top){
clearinterval(timer);
timer = null;
}
}
};
if(document.addeventlistener){
document.addeventlistener("domcontentloaded", bindready, false);
}else if(document.attachevent){
document.attachevent("onreadystatechange", function(){
if((/loaded|complete/).test(document.readystate))
bindready();
});
if(window == window.top){
timer = setinterval(function(){
try{
isready||document.documentelement.doscroll('left');//在ie下用能否执行doscroll判断dom是否加载完毕
}catch(e){
return;
}
bindready();
},5);
}
}
})();
如对本文有疑问, 点击进行留言回复!!
使用纯前端JavaScript实现Excel导入导出方法过程详解
微信小程序完美解决scroll-view高度自适应问题的方法
bootstrap-closable-tab可实现关闭的tab标签页插件
vue-cli单页面预渲染seo-prerender-spa-plugin操作
网友评论