<td class="a-right">
  <span class="price-excl-tax">
    <span class="price">$299.00</span>
  </span>
  <br>
</td>

У меня есть приведенный выше код в HTML генерируется. Мне нужно использовать JS Prototype, чтобы получить значение внутреннего диапазона. Существует несколько промежутков с классом «цена», но только этот вложен в класс «цена-без налога».

http://prototypejs.org/doc/latest/Prototype/Selector/

Вот что у меня есть:

console.log("Base price is: " + $$('price-excl-tax')[0].$$(span.price[0]).value);
0
camdixon 24 Апр 2017 в 20:44

2 ответа

Лучший ответ

Как уже упоминал Бармар, используйте $$ () с CSS Выбор ребенка (хотя базовый селектор потомков также будет работать), как '.price-excl-tax > .price'.

См. Это показано в примере ниже. Обратите внимание, что он использует Event.observe () для dom :loaded (уникально для PrototypeJS), чтобы убедиться, что DOM загружен до запрашивая это. Также обратите внимание, что innerHTML используется для получения содержание элемента цены, хотя .textContent может также использоваться, если нет вложенных узлов HTML.

document.observe("dom:loaded", function() {
  var priceContainers = $$('.price-excl-tax > .price');
  if (priceContainers.length) { //Greater than 0
    console.log("Base price is: " + priceContainers[0].innerHTML);
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/prototype/1.7.3/prototype.js"></script>
<table>
  <tr>
    <td class="a-right">
      <span class="price-excl-tax">
    <span class="price">$299.00</span>
      </span>
      <br>
    </td>
  </tr>
</table>

Альтернативный подход заключается в использовании Element.select (). Что-то вроде:

var priceExclTaxContainers = $$('.price-excl-tax');
if (priceExclTaxContainers.length) { //not empty
    var priceContainers = priceExclTaxContainers.select('.price');
    if (priceContainers.length) {
          //utilize priceContainers[0].innerHTML
    }
}
0
Sᴀᴍ Onᴇᴌᴀ 3 Май 2017 в 22:59

Почему бы не использовать дочерний селектор. см. фрагмент кода ниже

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td class="a-right">
  <span class="price-excl-tax">
    <span class="price">$299.00</span>
  </span>
  <br>
</td>
<script>
console.log("Base price is: " + $("price-excl-tax > price"));
</script>
1
sumit chauhan 24 Апр 2017 в 17:50