JavaScript querySelector конкретного HTML класса

Question

Если AJAX возвращает несколько записей, которые имеют следующую конструкцию, как я могу выбрать значение входного тега c, указанного в 'review'?

`<div class="record">
<div class="record_item">${element.name}</div> 
<div class="record_item">${element.type}</div> 
<div class="record_item">${element.country}</div> 
<div class="record_item">${element.region}</div> 
<div class="record_item"><input type="text" class="review" name="review"></div>
<button onclick="ajaxReview('${element.id}')">Review</button>
</div>`).join('');

Answer 1

const el = document.querySelector(".record");

const getInputNameTag=el.children[4].children[0].name

if(getInputNameTag==="review"){
	console.log("Value from input: ", el.children[4].children[0].value)
}

<div class="record">
  <div class="record_item">${element.name}</div> 
  <div class="record_item">${element.type}</div> 
  <div class="record_item">${element.country}</div> 
  <div class="record_item">${element.region}</div> 
  <div class="record_item">
    <input type="text" class="review" value="asdf" name="review"/>
  </div>
  <button onclick="ajaxReview('${element.id}')">Review</button>
</div>

const el = document.querySelector(".record");

const getInputNameTag=el.children[4].children[0].name

if(getInputNameTag==="review"){
    console.log(el.children[4].children[0].value)
}

Вы можете выбрать элемент и l oop через все дочерние элементы и посмотреть, есть ли у них поле ввода с именем 'review', чтобы сделать его более динамичным c на случай, если вы измените свою форму.

РЕДАКТИРОВАТЬ: Добавлен фрагмент кода