Javascript getElementById的简写

Question

是否有JavaScript document.getElementById的简写？或者我有什么方法可以定义一个？而越发重复重复输入了和超过.

Answer 1

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

$( 'someID' )

我在这里使用过$,但你可以使用任何有效的变量名.

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

byId( 'someID' )

Answer 2

要保存额外的字符,您可能会污染String原型,如下所示:

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);
    }
}

它适用于某些浏览器,您可以通过以下方式访问元素:

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

我几乎随机选择了该物业的名称.如果你真的想用这个简写,我会建议你想出一些更容易打字的东西.

Answer 3

您可以轻松地轻松创建速记:

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

Answer 4

贡献的快速替代方案:

HTMLDocument.prototype.e = document.getElementById

然后就做:

document.e('id');

有一个问题,它不适用于不允许扩展原型的浏览器(例如IE6).

Answer 5

(简写不仅要按ID获取元素,还要逐个元素获取:P)

我喜欢用的东西

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;
    }
}

用法:_(".test")返回带有类名的所有元素test,并_("#blah")返回一个带id的元素blah.

Answer 6

id已保存到window.

HTML

 <div id='logo'>logo</div>

JS

logo.innerHTML;

与写作相同:

document.getElementById( 'logo' ).innerHtml;

我不建议使用前一种方法,因为这不是常见的做法.

Answer 7

<script>
var _ = function(eId)
{
    return getElementById(eId);
}
</script>

<script>
var myDiv = _('id');
</script>

Answer 8

这里有几个很好的答案,有几个围绕类似jQuery的语法跳舞,但没有人提到实际使用jQuery.如果你不反对尝试它,请查看jQuery.它让你选择这样的元素非常容易..

按ID:

$('#elementId')

通过CSS类:

$('.className')

按元素类型:

$('a')  // all anchors on page 
$('inputs')  // all inputs on page 
$('p a')  // all anchors within paragaphs on page 

Answer 9

没有内置的.

如果您不介意污染全局命名空间,为什么不:

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

编辑 - 我将函数名称更改为不寻常的东西,但是短而且没有与jQuery或任何使用裸$号的其他任何东西发生冲突.

Answer 10

我经常使用：

var byId='getElementById'
var byClass='getElementsByClass'
var byTag='getElementsByTag'


var mydiv=document[byId]('div') 
/* as document["getElementById"] === document.getElementById */

我认为它比外部函数（例如$()或byId()）更好，因为你可以这样做：

var link=document[byId]('list')[byClass]('li')[0][byTag]('a')[0]

顺便说一句，不要为此使用 jQuery，jQuery 比、 或 等document.getElementById()外部函数或我的方法 慢得多： http://jsperf.com/document-getelementbyid-vs-jquery/5$()byId()