2015-10-09 4 views
0

Я хочу ярлык для someElement.getElementById.Создание ярлыка для .getElementById

Но вместо того, чтобы звонить .getElementById(), как я могу это сделать, я просто говорю, например, .foo()?

Например, можно сказать:

var element = document.foo("sampleID"); 
element.style.color = "red"; 

изменить color стиль элемента с идентификатором #sampleID красным.

Или:

var element = document.foo("someDiv").foo("myElement"); 
element.style.backgroundColor = "blue" 

Чтобы изменить ребенок документа с "ребенком ы с ID myElement Ид someDiv s цвета фона на синий.

В более ясном виде это будет искать элемент, являющийся дочерним элементом документа, и имеет ID someDiv. Тогда он будет искать ребенка из того, что имеет id myElement. Затем он изменит цвет фона на синий.

Я попытался выполнить поиск в Интернете для этих типов функций, но я понятия не имею, что они называются, поэтому мне не повезло.

+0

@JamesThorpe Я добавил пример. Это помогает? – Quelklef

+0

Вы можете назначить любую функцию переменной или свойству: 'document.foo = document.getElementById'. – Xufox

+3

Это действительно плохая идея. Не определяйте свои собственные функции на встроенных объектах. – meagar

ответ

1

Если вы хотите добавить псевдоним getElementById в foo, то, как следует из других ответов/комментариев, сделайте

document.foo = document.getElementById; 

Наверное, это не очень хорошая идея.

Но вы, кажется, хотите найти элементы с определенным идентификатором внутри элементов с каким-либо другим идентификатором. Но идентификаторы уникальны. Поэтому нет необходимости искать элемент с одним конкретным идентификатором внутри элемента с другим конкретным идентификатором. В основном, getElementById определяется только на document, а не на произвольных элементах.

Таким образом, на самом деле нет способа поиска элемента с одним ID в одном с другой идеей с помощью getElementById; вам нужно будет использовать document.querySelector('#someDiv #myElement'), но во всех разумных сценариях это точно эквивалентно document.querySelector('#myElement'), что в точности эквивалентно document.getElementById('myElement').

1
function foo(param) { 
    doSomethingWith(param); 
} 

... и называть это так:

foo(param); 

Но как я могу сделать это так, вы вместо того, чтобы назвать это, как это?

param.foo();

Нет, вы этого не сделаете. Параметр - аргумент, который не может вызвать функцию.

Определяя функцию вашего требования и возвращая его базовый объект.

Вы можете сделать такой же тип функции для ClassName и других. Лучше использовать jQuery вместо создания функции быстрого доступа. Он имеет больше полезности и других основных и предварительных методов использования.

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

 
alert(byId('MY_ID').innerHTML);
<p id="MY_ID">Hi</p>

+0

прав, за исключением того, что я хочу сказать 'alert (document.byId ('MY_ID'). InnerHTML);'. Это то, о чем я прошу. – Quelklef

+0

Я не хочу использовать JQ только потому, что я не делаю тонны в JS и не хочу загружать всю библиотеку для чего-то маленького. – Quelklef

+0

@Quelklef Затем создайте глобальную функцию '$' или '_' или что хотите. Нет причин присоединять вашу функцию к 'document'. – meagar

0

Короткий ответ:

document.foo = HTMLElement.prototype.foo = document.getElementById.bind(document); 

позволит сделать document.foo('id').foo('id2')

-

document является объектом и getElementById является функцией, которая может быть назначена свойство такого объекта.

Если вы хотите, чтобы сделать работу document.foo как document.getElementById, сделать

document.foo = document.getElementById 

Если вы хотите создать функцию на всех HTMLElement с, то вы должны сделать

HTMLElement.prototype.foo = function() { ... } 

Вы не можете, как правило, сделайте getElementById на HTMLElement, так как вы должны просто называть его на документе вместо этого (ids должны быть уникальными, поэтому он будет иметь тот же результат). Если вы действительно хотите сделать это,

HTMLElement.prototype.foo = document.getElementById 

-

В целом, для большинства значений param, вы можете установить param.foo = все, что вы хотите, в том числе функции

param.foo = function() { ... } 

Если вы хотите это применимо ко всем элементам определенного типа, вы должны прикрепить его к элементу prototype.

Например, если у вас есть тип Bar, то вы бы прикрепить функцию Bar.prototype как

Bar.prototype.foo = function() { ... } 

и экземпляры Bar будут иметь foo() функцию на них вызываемую как

var b = new Bar(); b.foo(); 
+0

Но да, как комментирует комментарий @ meagar, это, как правило, действительно плохая идея. – arcyqwerty

Смежные вопросы