Javascript raccourci pour getElementById

Question

Est-il un raccourci pour le JavaScript document.getElementById? Ou est-il possible que je puisse le définir? Il obtient répétitive retaper que plus et plus.

Answer 1

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

$( 'someID' )

Ici, j'ai utilisé $, mais vous pouvez utiliser n'importe quel nom de variable valide.

var byId = function( id ) { return document.getElementById( id ); };

byId( 'someID' )

Answer 2

Pour enregistrer un supplément de caractère vous pourraient polluer la Chaîne de prototype comme ceci:

pollutePrototype(String, '绎', {
    configurable: false, // others must fail
    get: function() {
        return document.getElementById(this);
    },
    set: function(element) {
        element.id = this;
    }
});

function pollutePrototype(buildIn, name, descr) {
    var oldDescr = Object.getOwnPropertyDescriptor(buildIn.prototype, name);
    if (oldDescr && !oldDescr.configurable) {
        console.error('Unable to replace ' + buildIn.name + '.prototype.' + name + '!');
    } else {
        if (oldDescr) {
            console.warn('Replacing ' + buildIn.name + '.prototype.' + name + ' might cause unexpected behaviour.');
        }
        Object.defineProperty(buildIn.prototype, name, descr);
    }
}

Il fonctionne dans certains navigateurs, et vous pouvez accéder à des éléments de cette façon:

document.body.appendChild(
    'footer'.绎 = document.createElement('div')
);
'footer'.绎.textContent = 'btw nice browser :)';

J'ai choisi le nom de la propriété de manière quasi aléatoire. Si vous avez réellement voulu utiliser ce raccourci, je vous recommandons de venir avec quelque chose de plus facile à taper.

Answer 3

Vous pouvez facilement créer des listes d'abréviations facilement vous-même:

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

Answer 4

Une alternative rapide et de contribuer:

HTMLDocument.prototype.e = document.getElementById

Puis il suffit de faire:

document.e('id');

Il y a un piège, il ne fonctionne pas dans les navigateurs qui ne les laissez pas vous étendre prototypes (par exemple, IE6).

Answer 5

(Raccourci pour non seulement obtenir de l'élément par son ID, mais aussi obtenir de l'élément par classe :P)

J'utilise quelque chose comme

function _(s){
    if(s.charAt(0)=='#')return [document.getElementById(s.slice(1))];
    else if(s.charAt(0)=='.'){
        var b=[],a=document.getElementsByTagName("*");
        for(i=0;i<a.length;i++)if(a[i].className.split(' ').indexOf(s.slice(1))>=0)b.push(a[i]);
        return b;
    }
}

Utilisation : _(".test") renvoie tous les éléments avec le nom de classe test, et _("#blah") renvoie un élément avec l'id blah.