getElementById
 

Есть блоки с id =id_product
на одной странице по 21штуке.

Не хочет выдергивать 1-2-3 и т.д
document.getElementById("id_product")[1].innerHTML;

может как-то по другому необходимо или в чем проблема?


document.getElementById("id_product").innerHTML - так берет первый ID.

ID - уникальный идентификатор.

<div class="product" id="product-1">...</div>
<div class="product" id="product-2">...</div>

<div class="product" data-product-id="1">...</div>
<div class="product" data-product-id="2">...</div>
<script>
//Получить первый товар используя id
document.getElementById("product-1");

//Получить первый товар используя  data-product-id
document.querySelector('[data-product-id="1"]');

//Получить коллекцию товаров используя data-product-id
document.querySelectorAll('[data-product-id]');
</script>

А по класу product, могу ли я выдернуть [1],[2]?
типа как-то так
document.getElementsByClassName("product").innerHT ML;

Да, все получилось как нужно таким макаром
document.getElementsByClassName("id_product")[1].innerHTML;