87,903
社区成员
发帖
与我相关
我的任务
分享jquery $().click()......这个是怎么实现的
把上面的问题简单化如下：
假设自己写了一个js文件, 里面的这个$('id').test('string') 执行完 会把id='id'的标签的文本换成'string'。
例如：点击a标签把p的文本换成123456；
以上例子中$('id').test('string') 该怎么实现？ 我写的只能$.test()。写成$().test()不行，不好使。
假设自己写了一个js文件, 里面的这个$('id').test('string') 执行完 会把id='id'的标签的文本换成'string'。
例如：点击a标签把p的文本换成123456；
<p id='asd'>求助</p>
<a onclick = $('asd').test('123456')><a>
以上例子中$('id').test('string') 该怎么实现？ 我写的只能$.test()。写成$().test()不行，不好使。
...全文
请发表友善的回复…
发表回复
jiangbai333 2013-12-02
- 打赏
- 举报
嗯 没错 我就是这么想的，不过上面几位说的要把$()当作一个对象返回，我就不太明白了。因为按照上面几个朋友的代码，返回的$()并没有用到。用到的是this.dom这个属性啊。
function $(id){
if(typeof id == 'undefined'){
alert('must a string');
}
if(this == window){
return new $(id);
}
this.dom = document.getElementById(id);
}
$.prototype = {
test : function(text){
this.dom.innerText = text;
}
}
(function(window){
_$ = window.$;
$ = function(o){
if(Boolean(o) == false)
return event.srcElement;
else
return typeof(o) == "string"?document.getElementById(o):o;
};
$.test=function(str){
document.write('郁闷蛋疼'+str);
}
}(window))
jiangbai333 2013-12-02
- 打赏
- 举报
嗯 没错 我就是这么想的，不过上面几位说的要把$()当作一个对象返回，我就不太明白了。因为按照上面几个朋友的代码，返回的$()并没有用到。用到的是this.dom这个属性啊。
非常感谢
Class.prototype 是给class添加属性的吧
class.prototype={
}
function $(id){
if(typeof id == 'undefined'){
alert('must a string');
}
if(this == window){
return new $(id);
}
this.dom = document.getElementById(id);
}
$.prototype = {
test : function(text){
this.dom.innerText = text;
}
}
(function(window){
_$ = window.$;
$ = function(o){
if(Boolean(o) == false)
return event.srcElement;
else
return typeof(o) == "string"?document.getElementById(o):o;
};
$.test=function(str){
document.write('郁闷蛋疼'+str);
}
}(window))
function Class(id)
{
//对象的构造函数
}
Class.prototype.mt = function ()
{
//对象的一个方法
alert(34);
}
//这个Class对象的使用方法有
//方法1：
var obj = new Class(123);
obj.mt();
//方法2：
new Class(123).mt();
//方法3：
var $ = function (id)
{
return new Class(id);
};
$(123).mt();
天际的海浪 2013-12-02
- 打赏
- 举报
嗯 没错 我就是这么想的，不过上面几位说的要把$()当作一个对象返回，我就不太明白了。因为按照上面几个朋友的代码，返回的$()并没有用到。用到的是this.dom这个属性啊。
function $(id){
if(typeof id == 'undefined'){
alert('must a string');
}
if(this == window){
return new $(id);
}
this.dom = document.getElementById(id);
}
$.prototype = {
test : function(text){
this.dom.innerText = text;
}
}
(function(window){
_$ = window.$;
$ = function(o){
if(Boolean(o) == false)
return event.srcElement;
else
return typeof(o) == "string"?document.getElementById(o):o;
};
$.test=function(str){
document.write('郁闷蛋疼'+str);
}
}(window))
function Class(id)
{
//对象的构造函数
}
Class.prototype.mt = function ()
{
//对象的一个方法
alert(34);
}
//这个Class对象的使用方法有
//方法1：
var obj = new Class(123);
obj.mt();
//方法2：
new Class(123).mt();
//方法3：
var $ = function (id)
{
return new Class(id);
};
$(123).mt();
xuzuning 2013-12-01
- 打赏
- 举报
没有什么不好理解的
你只需把 $(id)
当做 document.getElementById(id) 的缩写
就可以了
于是 o = $(id) 后 o 就具有了 id 为 'id' 的 dom 对象的一切属性和方法了
jiangbai333 2013-11-30
- 打赏
- 举报
这个能看懂但是到了匿名函数里就懵了，看网上说要把对象挂载到window对象上，比如$，网上说window.$挂载这个对象，但是$里面又有别的属性，换句话说一级一级属性把我弄得很糊涂，不知道如何把子属性和父属性联系起来。
圣光麦造 2013-11-30
- 打赏
- 举报
var divDrag = {
o: null,
init: function (divHeader, DivContent) {
divHeader.onmousedown = this.start;
DivContent.onmousedown = this.start;
},
start: function (e) {
var o;
divDrag.o = o = document.getElementById("tanchu_warrper");
e = divDrag.fixEvent(e);
e.preventDefault && e.preventDefault();
o.x = e.clientX - divDrag.o.offsetLeft + 239;
o.y = e.clientY - divDrag.o.offsetTop + 150;
document.onmousemove = divDrag.move;
document.onmouseup = divDrag.end;
},
move: function (e) {
e = divDrag.fixEvent(e);
var oLeft, oTop;
oLeft = e.clientX - divDrag.o.x + 239;
oTop = e.clientY - divDrag.o.y + 150;
divDrag.o.style.left = oLeft + 'px';
divDrag.o.style.top = oTop + 'px';
divleft = oLeft * 1;
divtop = oTop * 1;
},
end: function (e) {
e = divDrag.fixEvent(e);
divDrag.o = document.onmousemove = document.onmouseup = null;
},
fixEvent: function (e) {
if (!e) {
e = window.event;
e.target = e.srcElement;
e.layerX = e.offsetX;
e.layerY = e.offsetY;
}
return e;
}
}
divDrag.init(div, divBox);
zhjdg 2013-11-30
- 打赏
- 举报
没人接。他不需人接，因为直接用连写了。
<p id='asd'>求助</p>
<script>
function $(id){
this.dom = document.getElementById(id)
}
$.prototype = {
changeText : function(){
this.dom.innerText = 'fuck ?';
return this;
},
changeStyle : function(){
this.dom.style.color = 'red';
return this;
}
}
new $('asd').changeText().changeStyle();
</script>
jiangbai333 2013-11-30
- 打赏
- 举报
return new $(id);
l676331991 2013-11-30
- 打赏
- 举报
return new $(id);jiangbai333 2013-11-30
- 打赏
- 举报
return new $(id);
custom1234 2013-11-30
- 打赏
- 举报
jiangbai333 2013-11-30
- 打赏
- 举报
上面已经有这段代码了
阿布阿土 2013-11-30
- 打赏
- 举报
function $(id){
if(typeof id == 'undefined'){
alert('must a string');
}
if(this == window){
return new $(id);
}
this.dom = document.getElementById(id);
}
$.prototype = {
test : function(text){
this.dom.innerText = text;
}
}
zhjdg 2013-11-29
- 打赏
- 举报
其实只要会用调试器，理解起来就简单多了。
zhjdg 2013-11-29
- 打赏
- 举报
上面是老jQuery的写法。
下面是新jQuery的写法。
function $(id){
if(typeof id == 'undefined'){
alert('must a string');
}
return new $.prototype.init(id);
}
$.prototype = {
test : function(text){
this.dom.innerText = text;
},
init : function(id){
this.dom = document.getElementById(id);
}
}
$.prototype.init.prototype = $.prototype;zhjdg 2013-11-29
- 打赏
- 举报
function $(id){
if(typeof id == 'undefined'){
alert('must a string');
}
if(this == window){
return new $(id);
}
this.dom = document.getElementById(id);
}
$.prototype = {
test : function(text){
this.dom.innerText = text;
}
}
ftiger 2013-11-29
- 打赏
- 举报
你要干活，就去看jQuery 的API，你要学习，就去用原生的javascript,你用jQuery 去学习原生的javascript，自己找累，jQuery 里有很多高级的javascript运用方法，你基础没打好就想去了解jQuery 的原理，自己加大了学习的复杂性。
propotype，就是javascript的原生类实现机制，用于封装类的公共方法，主要是共享内存，多个类实例共同使用一段程序片段，以节约内存。
function A() {
this.name= "A";
this.show = function(){
alert(this.name);
}
}
function B (){
this.name= "B";
}
B.prototype.show = function(){
alert(this.name);
}
在这里，你new A(); new B();他们的show()方法都是一样的，不过一般推荐的写法是第二个。好处一个是节约内存，另一个扩展方便，你可以写个基本类，然后在别的文件里对这个类进行扩展，而且可以直接修改javascript内置对象Array,String,Function等的prototype 进行扩展。
当然对javascript内置对象的prototype 扩展有两种对立的思路，一种认为这种做法污染了原生的javascript，容易造成版本控制混乱，倾向于用别的方法实现，代表就是jQuery，另一种是认为合理的扩展是必须的，简化API，让程序更好理解，代表是Mootools.
天际的海浪 2013-11-29
- 打赏
- 举报
(function(window){
_$ = window.$;
$ = function(o){
if(Boolean(o) == false)
return event.srcElement;
else
return typeof(o) == "string"?document.getElementById(o):o;
};
$.test=function(str){
document.write('郁闷蛋疼'+str);
}
}(window))
jiangbai333 2013-11-29
- 打赏
- 举报
(function(window){
_$ = window.$;
$ = function(o){
if(Boolean(o) == false)
return event.srcElement;
else
return typeof(o) == "string"?document.getElementById(o):o;
};
$.test=function(str){
document.write('郁闷蛋疼'+str);
}
}(window))
天际的海浪 2013-11-29
- 打赏
- 举报
LZ要先了解下怎么创建对象，那个$()函数就是返回个对象的实例
加载更多回复（8）
