Запись HTML объектов в JS массив

281
17 октября 2017, 01:55

Есть такой HTML

<tr id="dayWrap"> 
  <td><?php echo $price_6; ?></td> 
  <td><?php echo $price_5; ?></td> 
  <td><?php echo $price_4; ?></td> 
  <td><?php echo $price_3; ?></td> 
  <td><?php echo $price_2; ?></td> 
  <td><?php echo $price_1; ?></td> 
</tr>

Нужно значения из каждого td загрузить в массив, чтобы в дальнейшем обращаться к нему выгружая данные при определенном действии. Спасибо!

Answer 1

Ну, как вариант так можно попробовать

let parent = document.querySelector('#dayWrap'); 
 
let values = []; 
 
for ( let i = 0; i < parent.children.length; i++ ) { 
	values.push( parent.children[i].innerHTML ); 
} 
 
console.dir( values );
<table> 
  <tr id="dayWrap"> 
    <td>1 - one</td> 
    <td>2 - two</td> 
    <td>3 - three</td> 
    <td>4 - four</td> 
  </tr> 
</table>

Answer 2

прокути их в цикле и получешь массив

var arr = [] 
var td = document.getElementsByTagName('td'); 
for (var i = 0; i < td.length; i++) { 
 
  arr = td[i].innerHTML; 
  console.log(arr) 
}
<table> 
  <tr id="dayWrap"> 
    <td> 
      <?php echo $price_6; ?> 
    </td> 
    <td> 
      <?php echo $price_5; ?> 
    </td> 
    <td> 
      <?php echo $price_4; ?> 
    </td> 
    <td> 
      <?php echo $price_3; ?> 
    </td> 
    <td> 
      <?php echo $price_2; ?> 
    </td> 
    <td> 
      <?php echo $price_1; ?> 
    </td> 
  </tr> 
</table>

Answer 3

Чисто в учебных целях, еще можно сделать так :

let td = document.querySelectorAll('#dayWrap td'); 
 
var result = Array.from(td).map((e) => { 
  return e.innerHTML; 
}); 
 
console.log(result);
<table> 
  <tr id="dayWrap"> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
    <td>4</td> 
  </tr> 
</table>

READ ALSO
Быстрое раскомментирование строки

Быстрое раскомментирование строки

Здравствуйте, поясните пожалуйста с чем связан тот факт,что при быстром раскомментировании в html файле сочетанием клавиш crtl + '/' остается '-->'

194
3d модели на сайте

3d модели на сайте

Добрый вечерДелаю сайт оружейной энциклопедии

137
Как проверить адаптивность верстки?

Как проверить адаптивность верстки?

Сделала для сайта адаптивную верстку под ширину экрана меньше 400 пикселейОткрываю в Safari с Iphone 5 (реальное устройство), все работает идеально

198
не правильная работа html таблицы

не правильная работа html таблицы

Всем приветНе могу решить проблему с таблицей

207