Кратчайший возможный JS-код для получения идентификаторов всех элементов данного тега

#javascript

#javascript

Вопрос:

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

 <div>
  <foobar id="456"></foobar>
  <foobar id="aaa"></foobar>
  <foobar id="987"></foobar>
<div>
  

Должен давать "456,aaa,987"

foobar Элементы никогда не будут вложенными, если это имеет значение.

Мое текущее решение

 [].slice.call(document.getElementsByTagName("foobar")).map(function(a){return a.id}).join(","))
  

Есть ли способ сделать это в чистом JS с еще более коротким (после минификации) оператором?

Редактировать: в ES5 (он же «обычный» javascript)

Редактировать 2: я смог срезать несколько символов с:

 [].map.call(document.getElementsByTagName("foobar"),function(a){return a.id}).join();
  

Комментарии:

1. Вы могли бы использовать функцию со стрелкой и избавиться от ключевого слова function. [].slice.call(document.getElementsByTagName(«foobar»)).map((a) => a.id ).join(«,»)

2. @Kolby Это должно быть ES5; добавит к вопросу

Ответ №1:

Я полагаю, что с ES5 мало что можно сделать, однако обратите внимание, что значение аргумента по умолчанию для join функции равно ‘,’ поэтому вы можете пропустить это, и в конечном итоге это будет выглядеть так:

 [].slice.call(document.getElementsByTagName("foobar")).map(function(a){return a.id}).join()
  

С ES6 вы можете преобразовать массивы, похожие на массивы, используя Array.from, также вы могли бы использовать лямбда-выражение, чтобы сократить его еще больше.

Таким образом, это будет выглядеть так:

 Array.from(document.getElementsByTagName("div")).map(a => a.id).join()
  

Комментарии:

1. Добавлено, что это должен быть ES5

2. Хороший вызов join() . Добавлено в мое редактирование, которое все еще немного короче этого

Ответ №2:

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

 [].map.call(document.querySelectorAll('foobar'),function(a){return a.id}).join()
  

Комментарии:

1. просто ответ, который я публиковал :-). На самом деле это join(«,»)

2. @Christophe в этом вообще нет необходимости. Согласно документам MDN Array.prototype.join() , разделитель является необязательным, и его значение по умолчанию равно "," .

3. Очень удобно;D

Ответ №3:

Я не думаю, что это будет намного короче, чем это:

 [].map.call(document.querySelectorAll("foobar"),function(a){return a.id}) "";
  

Ответ №4:

Собирает все ‘foobar’ и печатает значения идентификаторов, разделенные так, как вы хотели.

 <div>
  <foobar id="456"></foobar>
  <foobar id="aaa"></foobar>
  <foobar id="987"></foobar>
<div>

<script>

var str = "";

var x = document.getElementsByTagName("foobar");

for(var i=0; i<x.length; i  ){
	str = (str=="")?x[i].id:str "," x[i].id;
}

console.log(str);
</script>  

Комментарии:

1. Это длиннее, чем мое текущее решение

2. Но это чистый Javascript

3. Как и мое текущее решение