Set document.getElementById alla variabile

Question

le seguenti opere:

$ = document.form; 
    x = $.name.value; 

Questo non significa:

$ = document.getElementById; 
    x = $("id").value; 

Tutte le idee sul perché questo non funziona o come fare così?

Answer 1

Se si sta tentando di ottenere qualcosa di simile, suggerirei di utilizzare jQuery. La loro notazione $ è molto più potente di un semplice elemento per ID.

Inoltre, se si utilizza una piattaforma che utilizza già $ come variabile (talvolta l'ASP .Net lo utilizza) si potrebbe avere un risultato imprevedibile.

Answer 2

Il valore di this dipende da come si chiama la funzione.

Quando si chiama document.getElementById quindi getElementById diventa this === document. Quando si copia getElementById in una variabile diversa e quindi si chiama come $ quindi this === window (perché window è la variabile predefinita).

Questo fa quindi cercare l'id nell'oggetto della finestra anziché nell'oggetto del documento e questo non funziona in modo orribile perché Windows non è un documento e non ha gli stessi metodi.

È necessario mantenere document nella chiamata. Ad esempio, puoi utilizzare le funzioni wrapper per es.

function $ (id) { return document.getElementById(id); } 

... ma si prega di non utilizzare $. È un nome orribile. Non ha significato e confonderà le persone che lo vedono e pensano "Ah, conosco jQuery!" o "Ah, conosco il prototipo" o ecc. ecc.

Answer 3

getElementById è un metodo del prototipo HTMLDocument (di cui document è un'istanza). Quindi, chiamando la funzione nel contesto globale otterrai sicuramente un "Wrong this Error" o qualcosa del genere.

È possibile utilizzare

var $ = document.getElementById.bind(document); 

ma

function $(id) { return document.getElementById(id); } 

è anche OK e forse meglio comprendere.

Answer 4

Non so che cosa si vuole raggiungere, ma questo può essere fatto lavorare in questo modo

$ = document.getElementById; 
x = $.call(document, "id").value; 

perchè getElementById funziona solo quando è in funzione della document a causa del campo di applicazione di cui ha bisogno.

Ma vorrei raccomandare la risposta di @ Quentin.

Answer 5

L'oggetto contesto è diverso.Quando si ottiene un riferimento di una funzione che stai cambiando l'oggetto contesto:

var john = { 
    name : "john", 
    hello : function() { return "hello, I'm " + this.name } 
} 

var peter = { name : "peter" }; 

peter.hello = john.hello; 

peter.hello() // "hello, I'm peter" 

Se si desidera una funzione di riferimento legato ad un oggetto specifico contesto, è necessario utilizzare bind:

peter.hello = john.hello.bind(john); 

peter.hello(); // "hello, I'm john" 

Così nel tuo caso sarà:

var $ = document.getElementById.bind(document);