使用jQuery擴展DOM元素

我想擴展DOM元素而不擴展所有元素。也就是說，我想用自己的方法和屬性自定義類，但也可以把它作爲一個div。例如。使用jQuery擴展DOM元素

MyClass = function(){ 
    this.foo = "waaa"; 
} 
MyClass.prototype.changeText = function(newtext){ 
    // if this extended $(document.createElement("div")) something 
    // like this might be possible 
    this.html(newtext); 
} 
MyClass.prototype.alertFoo = function(){ 
    alert(this.foo); 
} 

var m = new MyClass(); 
$("body").append(m); 
m.changetext();

這可能嗎？

來源

2009-07-23 pondermatic

你可以讓你的類的子類的jQuery產生的DIV元素：

function MyClass(){ 
    this.foo = "waaa"; 
} 
MyClass.prototype = $('<div/>'); 
MyClass.prototype.changeText = function(newtext){ 
    this.html(newtext); 
} 
MyClass.prototype.alertFoo = function(){ 
    alert(this.foo); 
} 

var m = new MyClass(); 
$("body").append(m); 
m.changeText('appletree');

來源

2010-10-17 21:18:34 user478779

當你將它傳遞給追加行時，jQuery將無法理解m，因爲它只接受字符串和元素。你的MyClass可能有一個特定的鍵來保存元素本身（例如this.el = document.createElement（「div」）;），但jQuery無法自己找到它。

來源

2009-07-23 22:31:27 Salty

瞭解了，以上只是我想要做的一個例子。本質上我正在尋找類似於： MyClass：document.createElement（「div」）也就是說，我不想告訴jquery查找特定鍵，但讓jquery認爲對象本身是元素，即我的對象擴展元素。 – pondermatic 2009-07-23 22:40:03

你可以製作你自己的物體，就像你在做什麼。然後你可以使用jQuery的extend method來擴展元素。

來源

2009-07-23 22:36:50 geowa4

這是行不通的：功能more（）{ \t \t \t \t this.myname =「more！」 \t \t \t} \t \t \t more.prototype.alert =函數（）{ \t \t \t \t警報（ '警報！'） \t \t \t} \t \t \t \t \t \t VAR的div = $（文件.createElement（「DIV」））; \t \t \t div.html（「this is s」）; \t \t \t \t \t \t $。擴展（true，div，more）; 。 \t \t \t \t \t \t $（文件）。就緒（函數（）{ \t \t \t \t $（「正文」）附加（DIV）; \t \t \t \t div.alert（）; \t \t \t \t alert（div.myname）; \t \t \t}）; – pondermatic 2009-07-23 22:48:12

正確的，你需要一個對象，而不是一個函數來處理`extend`方法。用這個代替相應的行：`$ .extend（true，div，new more）;` – geowa4 2009-07-24 01:07:21

當您想要稍後檢索元素時會出現問題。也許你可以只存儲擴展爲元素的數據像這樣：

var new_div = $('<div id="new_div" />'); 
new_div.data('m', new MyClass());

然後在以後調用的函數，你會做這樣的事情：

new_div.data('m').changetext(new_div)

而且通過DIV作爲參數。

來源

2009-07-23 22:38:26 Augustus

是的，我意識到這樣的事情是可能的，但它絕對不是優雅的。對於所有關於javascript的宣傳如此偉大，我無法讓自定義類像jquery duck那樣走路，這實際上很糟糕。 – pondermatic 2009-07-23 22:51:48

你也可以做它作爲一個插件：

jQuery.fn.myKindOfElement = function(msg) { 
    var foo = msg; // foo is basically a private member 
    this.alertFoo = function() { 
     alert(foo); 
    }; 
    this.setFoo = function(msg) { 
     foo = msg; 
    }; 
    this.changeText = function(text) { 
     // doesn't make sense because html already exists here 
     this.html(text); 
    }; 
};

那麼對於任何元素：

var myKind = $('<div/>').myKindOfElement('bar'); 
$('body').append(myKind); 
myKind.alertFoo(); // alerts 'bar' 
myKind.changeText('blah'); // same as myKind.html('blah')

來源

2009-07-23 22:49:08 Prestaul

使用jQuery擴展DOM元素

回答

相關問題