如何解决如何在同一类中获得多个数字
我是 JavaScript 新手。 我有个问题。这是一个 HTML 代码:
<div class="priceBox cargoPriceBox">
<div class="title">Classe affaires</div>
<div class="price">Tarif actuel du billet : <b>5 175 $</b></div>
<div class="demand">Demande : 192 Pax</div>
<div class="paxLeft" title="J+1">
Demande restante : <span class="greenBonus" title="left">20 Pax</span>
</div>
<div class="auditCa">Chiffre d'affaires : <b>993 600 $</b></div>
</div>
<div class="priceBox cargoPriceBox">
<div class="title">Première classe</div>
<div class="price">Tarif actuel du billet : <b>10 224 $</b></div>
<div class="demand">Demande : 12 Pax</div>
<div class="paxLeft" title="J+1">
Demande restante : <span class="greenBonus" title="left">27 Pax</span>`enter code here`
我想获得所有带有 classe="greenBonus" 的数字,所以 20 和 27。 我使用以下代码但它不起作用
function getPAX(index) {
return parseInt(
document.getElementsByClassName("greenBonus").children[index].innerHTM);
}
请帮帮我, 谢谢x
解决方法
您可以获取所有元素,然后遍历它们并使用 parseInt() 添加数字
const res = document.getElementsByClassName("greenBonus");
let x = '';
for (var i=0;i<res.length;i++) {
x += ' ' + parseInt(res[i].innerHTML);
}
console.log(x)
<div class="priceBox cargoPriceBox">
<div class="title">Classe affaires</div>
<div class="price">Tarif actuel du billet : <b>5 175 $</b></div>
<div class="demand">Demande : 192 Pax</div>
<div class="paxLeft" title="J+1">
Demande restante : <span class="greenBonus" title="left">20 Pax</span>
</div>
<div class="auditCa">Chiffre d'affaires : <b>993 600 $</b></div>
</div>
<div class="priceBox cargoPriceBox">
<div class="title">Première classe</div>
<div class="price">Tarif actuel du billet : <b>10 224 $</b></div>
<div class="demand">Demande : 12 Pax</div>
<div class="paxLeft" title="J+1">
Demande restante : <span class="greenBonus" title="left">27 Pax</span>`enter code here`
你可以像这样用 class="greenBonus"
定位元素,它会返回一个包含元素的数组
const greenBonus = document.getElementsByClassName("greenBonus");
您可以使用传统的 for loop
来执行此操作,但我将在此处使用 map 方法
您可以在数组上使用map
方法并获取元素的innerText并使用parseInt
方法将它们转换为数字
const texts = [...greenBonus].map((i) => parseInt( i));
最终代码:
<div class="priceBox cargoPriceBox">
<div class="title">Classe affaires</div>
<div class="price">Tarif actuel du billet : <b>5 175 $</b></div>
<div class="demand">Demande : 192 Pax</div>
<div class="paxLeft" title="J+1">
Demande restante : <span class="greenBonus" title="left">20 Pax</span>
</div>
<div class="auditCa">Chiffre d'affaires : <b>993 600 $</b></div>
</div>
<div class="priceBox cargoPriceBox">
<div class="title">Première classe</div>
<div class="price">Tarif actuel du billet : <b>10 224 $</b></div>
<div class="demand">Demande : 12 Pax</div>
<div class="paxLeft" title="J+1">
Demande restante : <span class="greenBonus" title="left">27 Pax</span>
function getPax(){
const greenBonus = document.getElementsByClassName("greenBonus");
const texts = [...greenBonus].map((i) => parseInt( i.innerText));
}
输出结果为 27,20
我希望这会有所帮助 :D
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。