javascript - getelementbyid jquery

Establezca document.getElementById en la variable

Question

Los siguientes trabajos:

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

Esto no:

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

¿Alguna idea sobre por qué esto no funciona o cómo hacerlo?

Answer 1

El objeto de contexto es diferente. Cuando obtiene una referencia de una función, está cambiando ese objeto de contexto:

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"

Si desea una función de referencia vinculada a un objeto de contexto específico, debe usar bind :

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

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

Entonces en tu caso será:

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

Answer 2

El valor de this depende de cómo llame a la función.

Cuando llamas a document.getElementById , getElementById obtiene this === document . Cuando copie getElementById en una variable diferente y luego lo llame como $ entonces this === window (porque window es la variable predeterminada).

Esto hace que busque la identificación en el objeto de la ventana en lugar de hacerlo en el objeto del documento, y eso falla horriblemente porque las ventanas no son documentos y no tienen los mismos métodos.

Debe mantener el document en la llamada. Puede usar una función de envoltura para esto, por ejemplo

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

... pero por favor no use $ . Es un nombre horrible. No tiene ningún significado y confundirá a las personas que lo vean y piensen "¡Ah, lo sé, jQuery!" o "¡Ah, sé prototipo", etc.

Answer 3

No sé lo que quiere lograr, pero esto puede hacerse trabajando así

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

porque getElementById solo funciona cuando es una función del document debido al alcance que necesita.

Pero recomendaría la respuesta de @ Quentin.

Answer 4

Si intentas lograr algo así, te sugiero usar jQuery . Su notación $ es mucho más poderosa que solo obtener un elemento por id.

Además, si está utilizando una plataforma que ya usa $ como variable (ASP .Net a veces usa esto), puede tener un resultado impredecible.

Answer 5

getElementById es un método del prototipo HTMLDocument (cuyo document es una instancia). Por lo tanto, al llamar a la función en un contexto global, seguramente obtendrás un "Error incorrecto" o algo así.

Puedes utilizar

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

pero

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

también está bien y quizás sea mejor entenderlo.