是可以鏈接的document.getElementById方法嗎？

Question

如果我有這個模塊的模式：

var MODULE = (function(window){ 
    var myPublicStuff = {}; 

    myPublicStuff.myPublicMethod = function(e){ 
     return e; 
    }; 
    return myPublicStuff; 

})(window); //edit: forgot to put I have this 

這工作：（編輯爲清楚起見）

v = document.getElementById('some-element'); //works as expected 
MODULE.myPublicMethod(v); //works. 

但是，這並不工作，

MODULE.myPublicMethod().document.getElementById('some-element'); 

或

document.getElementById('some-element').MODULE.myPublicMethod(). 

我認爲如果在獄中的前一個成員返回一個值，你可以鏈接到下一個鏈接？這在這裏不起作用，但我不知道爲什麼。

編輯：感謝所有的答案。我想要做的就是獲取元素，並通過鏈接將該方法打印回。就這樣。如果我把'btnPrint'放在'btnPrint'中，我想讓它給我<button type="button" id="btnPrint" class="btn">...</button>如果我在控制檯上得到了ElementById，那麼如果我首先爲模塊使用一個變量（這是有道理的），那就是我所得到的。我只想做同樣的事情用鏈式方法。

編輯：爲了完整，這是特拉維斯上的jsfiddle把什麼（感謝）：

<button type="button" id="btnPrint" class="btn">...</button> 

Element.prototype.myPublicMethod = function(){ 
//in the prototype scheme that JavaScript uses, 
//the current instance of the Element is *this*, 
//so returning this will return the current Element 
//that we started with. 
return this; 

} 

console.log(document.getElementById("btnPrint").myPublicMethod()); 

我同意。這看起來很糟糕，除非絕對必要

Answer 1

Is document.getElementById a method that can be chained?

是。它返回一個元素（如果沒有匹配，則返回undefined）。該元素公開了一組通用函數，並且如果元素是特定類型（例如表單），那麼它也可能具有一組特定的函數。

在https://developer.mozilla.org/en-US/docs/Web/API/Element

I want to do this:

v = document.getElementById('some-element'); //works as expected 
MODULE.myPublicMethod(v); 

這裏瞭解更多關於通用元件類型，v很簡單，對不對？它只是獲得id="some-element"的元素。好的，從那裏你將它傳遞給myPublicMethod(v)。當你這樣做時，你所做的只是調用一個函數，該函數返回的值與傳入的值相同。除此之外，沒有任何分配或存儲發生在上面顯示的代碼中。

你可以在這裏做什麼，如果你想利用鏈接設置的，將是再從返回的值訪問v元素是這樣的：

v = document.getElementById('some-element'); 
var vId = MODULE.myPublicMethod(v).id; 
console.log(vId);// this will log "some-element" to the console 

But this does not work,

MODULE.myPublicMethod().document.getElementById('some-element'); 

所以上面我解釋說你正在「調用一個返回相同值的函數」，請記住myPublicMethod裏面只有return e;？那麼這意味着你使用undefined作爲結果，因爲在使用這行代碼時沒有任何東西被傳入。換句話說，上面的代碼可以檢查爲undefined.document.getElementById('some-element')，這有希望顯然是有問題的。

if I put in 'btnPrint' I want it to give me <button type="button" id="btnPrint" class="btn">...</button>

例如，你的代碼編寫會做到這一點這樣：

var MODULE = (function(window){ 
 
    var myPublicStuff = {}; 
 

 
    myPublicStuff.myPublicMethod = function(e){ 
 
     return e; 
 
    }; 
 
    return myPublicStuff; 
 
})(window); 
 

 
console.log(MODULE.myPublicMethod(document.getElementById('btnPrint')));

<button type="button" id="btnPrint" class="btn">...</button>

Answer 2

爲了避免v變量，你需要使用

MODULE.myPublicMethod(document.getElementById('some-element')); 

document是一個全球性的屬性（在window對象的），你需要已經返回，從myPublicMethod()到鏈斷了。由於它是身份的功能，你甚至可以做這樣的事情

MODULE.myPublicMethod(document).getElementById('some-element'); 
MODULE.myPublicMethod(window).document.getElementById('some-‌​element'); 

Answer 3

你可以從你的函數返回document如果沒有參數傳遞：

var MODULE = (function(window){ 
    var myPublicStuff = {}; 

    myPublicStuff.myPublicMethod = function(e){ 
     return e || document; 
    }; 
    return myPublicStuff; 

})(); 

var text = MODULE.myPublicMethod().getElementById('element').innerHTML; 

console.log(text); 

JSBin