87,992
社区成员
发帖
与我相关
我的任务
分享模拟jQuery 框架的问题，求高手帮忙。
<!doctype html>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
</style>
</head>
<body>
<div id="a">a</div>
<div id="b">b</div>
<script>
(function(){
var j = function(o){
return j.fn.init(o);
};
j.fn = j.prototype = {
init: function(o){
this[0] = document.getElementById(o);
this.length = 0;
return this
},
html: function(str){
if(str!=null){
this[0].innerHTML = str;
return this
}
return this[0].innerHTML;
},
size:function(){
return this.length;
}
}
window.$ = j;
})()
//alert( $('a').html() ) //a 框架成功
var b = $('b').html()
//$('a').html( b ) // 这样能够赋值成功
$('a').html( $('b').html() ) //但是 我不想用变量过渡，怎么用这样方式。
//我看了一下 jquery中 用isFunction来判断传来的变量，具体怎么实现的，不懂。
// 也就是说 怎么判断 html( str ) 中 str是否为函数，如果是函数，先运行它，再给innerHTML 赋值
</script>
</body>
</html>
上述问题，求高手帮忙。
...全文
请发表友善的回复…
发表回复
zgzglike 2011-10-26
- 打赏
- 举报
up.....
zgzglike 2011-10-26
- 打赏
- 举报
up一下。
KK3K2005 2011-10-24
- 打赏
- 举报
lz加油
模拟jq不是这么简单的
模拟jq不是这么简单的
liangws 2011-10-24
- 打赏
- 举报
$('a').html( $('b').html() ) //但是 我不想用变量过渡，怎么用这样方式。
// 也就是说 怎么判断 html( str ) 中 str是否为函数，如果是函数，先运行它，再给innerHTML 赋值
$('a').html( $('b').html() )中$('b').html()，这样写已经直接执行了啊。。
这种写法是函数式编程
这句话其实与
alert($('b').html());是一样的道理。。
$('b').html()已经执行，并且返回了$('b')的文本
如果真的需要你说的判断是否函数的话应该这样写
$('a').html( $('b').html ) 去掉(),$('b').html这个才是函数
// 也就是说 怎么判断 html( str ) 中 str是否为函数，如果是函数，先运行它，再给innerHTML 赋值
$('a').html( $('b').html() )中$('b').html()，这样写已经直接执行了啊。。
这种写法是函数式编程
这句话其实与
alert($('b').html());是一样的道理。。
$('b').html()已经执行，并且返回了$('b')的文本
如果真的需要你说的判断是否函数的话应该这样写
$('a').html( $('b').html ) 去掉(),$('b').html这个才是函数
一個程序員 2011-10-24
- 打赏
- 举报
[Quote=引用 9 楼 diky87688973 的回复:]
引用 6 楼 zgzglike 的回复:
我现在想自己构建一个 isFunction 来判断 html( str ) 传来的值是否是函数，可是不知道该怎么写。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
不太清楚你的意思，如果是仅是加个函数：
JScript code
(function(){
var j = function……
[/Quote]
日，不能加颜色，重发：
引用 6 楼 zgzglike 的回复:
我现在想自己构建一个 isFunction 来判断 html( str ) 传来的值是否是函数，可是不知道该怎么写。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
不太清楚你的意思，如果是仅是加个函数：
JScript code
(function(){
var j = function……
[/Quote]
日，不能加颜色，重发：
(function(){
var j = function(o){
return j.fn.init(o);
};
j.isFunction = function(f){
return typeof f == 'function' || f instanceof Function;
};
j.fn = j.prototype = {
init: function(o){
this[0] = document.getElementById(o);
this.length = 0;
return this
},
html: function(str){
if(typeof str == 'string'){
this[0].innerHTML = str;
return this
}
if(j.isFunction(str)){
// 不知你要判断它是函数做甚么，没有任何意义，html顾名思义，就是获取或设置html的方法，传个函数进来作甚？
// 如果是要判断传入的是j对象或j本身，可以用 str instanceof j 或 str === j
}
return this[0].innerHTML;
},
size:function(){
return this.length;
}
}
window.$ = j;
})()
一個程序員 2011-10-24
- 打赏
- 举报
[Quote=引用 6 楼 zgzglike 的回复:]
我现在想自己构建一个 isFunction 来判断 html( str ) 传来的值是否是函数，可是不知道该怎么写。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
[/Quote]
不太清楚你的意思，如果是仅是加个函数：
我现在想自己构建一个 isFunction 来判断 html( str ) 传来的值是否是函数，可是不知道该怎么写。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
[/Quote]
不太清楚你的意思，如果是仅是加个函数：
(function(){
var j = function(o){
return j.fn.init(o);
};
j.isFunction = function(f){
return typeof f == 'function' || f instanceof Function;
};
j.fn = j.prototype = {
init: function(o){
this[0] = document.getElementById(o);
this.length = 0;
return this
},
html: function(str){
if(typeof str == 'string'){
this[0].innerHTML = str;
return this
}
if(j.isFunction(str)){
// 不知你要判断它是函数做甚么，没有任何意义，html顾名思义，就是获取或设置html的方法，传个函数进来作甚？
// 如果是要判断传入的是j对象或j本身，可以用 str instanceof j 或 str === j
}
return this[0].innerHTML;
},
size:function(){
return this.length;
}
}
window.$ = j;
})()
lijpwsw 2011-10-24
- 打赏
- 举报
[Quote=引用 6 楼 zgzglike 的回复:]
我现在想自己构建一个 isFunction 来判断 html( str ) 传来的值是否是函数，可是不知道该怎么写。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
[/Quote]
您的意思是要修改jquery源码吗
我现在想自己构建一个 isFunction 来判断 html( str ) 传来的值是否是函数，可是不知道该怎么写。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
[/Quote]
您的意思是要修改jquery源码吗
zgzglike 2011-10-24
- 打赏
- 举报
[Quote=引用 21 楼 diky87688973 的回复:]
你为啥就不看仔细。。。？
你的代码根本就没写对，this永远指向str了。
我回复里面有短话：“// 你要的是这个结果吧？ 千万注意里面this哦，没有去构造j对象的话，this永远指向str的”
唉！我仔细说一次吧。
这个是你的问题代码：
JScript code
var j = function(o){
return j.fn.init(o);
};……
[/Quote]
恩 感觉有点眉目了，对象，原型链不了解啊。
你为啥就不看仔细。。。？
你的代码根本就没写对，this永远指向str了。
我回复里面有短话：“// 你要的是这个结果吧？ 千万注意里面this哦，没有去构造j对象的话，this永远指向str的”
唉！我仔细说一次吧。
这个是你的问题代码：
JScript code
var j = function(o){
return j.fn.init(o);
};……
[/Quote]
恩 感觉有点眉目了，对象，原型链不了解啊。
zgzglike 2011-10-24
- 打赏
- 举报
期待。。。
一個程序員 2011-10-24
- 打赏
- 举报
你为啥就不看仔细。。。？
你的代码根本就没写对，this永远指向str了。
我回复里面有短话：“// 你要的是这个结果吧？ 千万注意里面this哦，没有去构造j对象的话，this永远指向str的”
唉！我仔细说一次吧。
这个是你的问题代码：
你想实现j('a').html(j('b')), 打到把b的html赋值给a，对吧。
你的j('b')函数中，是直接调用j.fn.init方法， 而init方法中使用了this，你知道这个this是指谁么？
这个this指向函数的调用对象，即:j.fn, j.fn是个object，你已经定义了。
而你再用j('a'), 里面的this依旧指的是j.fn，你觉得这对么？
操作a，和操作b，都是操作了j.fn，这是错误的，j('a')与j('b')应该要返回不同对象，this的意思你没理解。。。
所以需要new一个对象出来做包装
这代码是模仿出来的吧：j.fn = j.prototype = {...}
一看就知道修改原型链：prototype ，目的就是要让其实例对象都具有原型链上的属性。
所以需要new一个j对象
将问题代码改成：
你的代码根本就没写对，this永远指向str了。
我回复里面有短话：“// 你要的是这个结果吧？ 千万注意里面this哦，没有去构造j对象的话，this永远指向str的”
唉！我仔细说一次吧。
这个是你的问题代码：
var j = function(o){
return j.fn.init(o);
};你想实现j('a').html(j('b')), 打到把b的html赋值给a，对吧。
你的j('b')函数中，是直接调用j.fn.init方法， 而init方法中使用了this，你知道这个this是指谁么？
这个this指向函数的调用对象，即:j.fn, j.fn是个object，你已经定义了。
而你再用j('a'), 里面的this依旧指的是j.fn，你觉得这对么？
操作a，和操作b，都是操作了j.fn，这是错误的，j('a')与j('b')应该要返回不同对象，this的意思你没理解。。。
所以需要new一个对象出来做包装
这代码是模仿出来的吧：j.fn = j.prototype = {...}
一看就知道修改原型链：prototype ，目的就是要让其实例对象都具有原型链上的属性。
所以需要new一个j对象
将问题代码改成：
// step 1：先将有 j.fn = j.prototype = {...}
// step 2：将j.fn赋值给j.fn.init的原型链，为的就是new一个j对象，因为直接new j()会执行j中的代码，不易操作
j.fn.init.prototype = j.fn;
var j = function(o){
// step 3：现在new j.fn.init 同等于 new j，但是不会执行到j()函数里面的代码，同时具备j.prototype原形链上的所有属性
return new j.fn.init(o);
};zgzglike 2011-10-24
- 打赏
- 举报
[Quote=引用 16 楼 danica7773 的回复:]
LZ好好看看和你的有什么不同
jQuery的框架原理LZ并没有真正的理解
JScript code
(function(){
var j = function(o){
return new j.fn.init(o); //////
};
j.fn = j.prototype = {
init: function……
[/Quote]
还是打字哥猛，
之前 读jquery的时候，就发现了 它是
return new 。。。
j.fn.init.prototype = j.fn;
可是不明白 为什么要这样写，，，求解释
LZ好好看看和你的有什么不同
jQuery的框架原理LZ并没有真正的理解
JScript code
(function(){
var j = function(o){
return new j.fn.init(o); //////
};
j.fn = j.prototype = {
init: function……
[/Quote]
还是打字哥猛，
之前 读jquery的时候，就发现了 它是
return new 。。。
j.fn.init.prototype = j.fn;
可是不明白 为什么要这样写，，，求解释
zgzglike 2011-10-24
- 打赏
- 举报
[Quote=引用 17 楼 diky87688973 的回复:]
引用 15 楼 zgzglike 的回复:
有高手吗？
我已经回复了你，不自己看，再发一遍：
(function(){
var j = function(o){
return j.fn.init(o);
};
j.isFunction = function(f){
return typeof f == 'function' || f i……
[/Quote]
之前 我也试过这中方法，不行。
引用 15 楼 zgzglike 的回复:
有高手吗？
我已经回复了你，不自己看，再发一遍：
(function(){
var j = function(o){
return j.fn.init(o);
};
j.isFunction = function(f){
return typeof f == 'function' || f i……
[/Quote]
之前 我也试过这中方法，不行。
leehuat 2011-10-24
- 打赏
- 举报
刚刚接触jquery 对jquery 的学习还没有达到
这张程度， 来学习的 帮你顶下
一個程序員 2011-10-24
- 打赏
- 举报
[Quote=引用 15 楼 zgzglike 的回复:]
有高手吗？
[/Quote]
我已经回复了你，不自己看，再发一遍：
(function(){
var j = function(o){
return j.fn.init(o);
};
j.isFunction = function(f){
return typeof f == 'function' || f instanceof Function;
};
j.fn = j.prototype = {
init: function(o){
this[0] = document.getElementById(o);
this.length = 0;
return this
},
html: function(str){
if(null == str) return this[0].innerHTML;
if(typeof str == 'string'){
this[0].innerHTML = str;
return this
}
if(str instanceof j || str === j){
this[0].innerHTML = str[0].innerHTML; // 你要的是这个结果吧？ 千万注意里面this哦，没有去构造j对象的话，this永远指向str的
}
},
size:function(){
return this.length;
}
}
window.$ = j;
})()
有高手吗？
[/Quote]
我已经回复了你，不自己看，再发一遍：
(function(){
var j = function(o){
return j.fn.init(o);
};
j.isFunction = function(f){
return typeof f == 'function' || f instanceof Function;
};
j.fn = j.prototype = {
init: function(o){
this[0] = document.getElementById(o);
this.length = 0;
return this
},
html: function(str){
if(null == str) return this[0].innerHTML;
if(typeof str == 'string'){
this[0].innerHTML = str;
return this
}
if(str instanceof j || str === j){
this[0].innerHTML = str[0].innerHTML; // 你要的是这个结果吧？ 千万注意里面this哦，没有去构造j对象的话，this永远指向str的
}
},
size:function(){
return this.length;
}
}
window.$ = j;
})()
打字员 2011-10-24
- 打赏
- 举报
LZ好好看看和你的有什么不同
jQuery的框架原理LZ并没有真正的理解
jQuery的框架原理LZ并没有真正的理解
(function(){
var j = function(o){
return new j.fn.init(o); //////
};
j.fn = j.prototype = {
init: function(o){
this[0] = document.getElementById(o);
this.length = 1;
return this
},
html: function(str){
if(str != null){
this[0].innerHTML = str;
return this
}
return this[0].innerHTML;
},
size:function(){
return this.length;
}
}
j.fn.init.prototype = j.fn; ///////
window.$ = j;
})()
$('a').html($('b').html());
zgzglike 2011-10-24
- 打赏
- 举报
有高手吗？
zgzglike 2011-10-24
- 打赏
- 举报
<!doctype html>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
</style>
</head>
<body>
<div id="a">i am a</div>
<div id="b">i am b</div>
<script>
(function(){
var j = function(o){
return j.fn.init(o);
};
j.fn = j.prototype = {
init: function(o){
this[0] = document.getElementById(o);
this.length = 0;
return this
},
html: function(str){
if(str!=null){
this[0].innerHTML = str;
return this
}
return this[0].innerHTML;
},
size:function(){
return this.length;
}
}
window.$ = j;
})()
//我的意思是
//比如现在我们想把 a 的innerHTML变为 b 的innerHTML
//方法1
var b = $('b').html()
//$('a').html( b ) //这里需要一个变量过渡
//方法2
//不用变量，直接 -->
$('a').html( $('b').html() )
/*
html: function(str){
if(str!=null){
this[0].innerHTML = str;
return this
}
return this[0].innerHTML;
}
str有值（直接值）时，可以赋值成功
但是 str为 $('b').html() 这样的方式时，却赋值不成功，
我的问题是，怎么让 $('a').html( $('b').html() ) 这样不使用变量过渡的方式也能成功赋值
*/
</script>
</body>
</html>
szwx855 2011-10-24
- 打赏
- 举报
[Quote=引用 11 楼 liangws 的回复:]
$('a').html( $('b').html() ) //但是 我不想用变量过渡，怎么用这样方式。
// 也就是说 怎么判断 html( str ) 中 str是否为函数，如果是函数，先运行它，再给innerHTML 赋值
$('a').html( $('b').html() )中$('b').html()，这样写已经直接执行了啊。。
这种写法是函数式编程
这句话其实与
……
[/Quote]
同意这个观点.
$('a').html( $('b').html() ) //但是 我不想用变量过渡，怎么用这样方式。
// 也就是说 怎么判断 html( str ) 中 str是否为函数，如果是函数，先运行它，再给innerHTML 赋值
$('a').html( $('b').html() )中$('b').html()，这样写已经直接执行了啊。。
这种写法是函数式编程
这句话其实与
……
[/Quote]
同意这个观点.
zgzglike 2011-10-23
- 打赏
- 举报
[Quote=引用 2 楼 xiaojing7 的回复:]
思路很正确，单isFunction 不就是运用 toString.call(obj) === "[object Function]" 来判断的？
[/Quote]
大哥，具体怎样实现呢？ 还望指教。
思路很正确，单isFunction 不就是运用 toString.call(obj) === "[object Function]" 来判断的？
[/Quote]
大哥，具体怎样实现呢？ 还望指教。
zgzglike 2011-10-23
- 打赏
- 举报
我现在想自己构建一个 isFunction 来判断 html( str ) 传来的值是否是函数，可是不知道该怎么写。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
在我贴的基础上怎么加这个函数呢？
期待高手。。。
加载更多回复（4）
