Question

<!DOCTYPE html>
<html>
<head>

<script>
window.onload = function() {
    var data = document.querySelectorAll('span.data-01', 'span.data-02');
    for (var i=0;i<len;i++) {
        console.log(data[i].className + " " + data[i].childNodes[0].nodeValue) 
        //var one = parseInt(data[i].childNodes[0].nodeValue);
        //var two = parseInt(data[i].childNodes[0].nodeValue);  
    }  
    //total = one + two;
    //console.log(total); 
};
</script>

</head>
<body>
<div class="info">
<span class="data-01">9000</span>
<span class="data-02">6500</span>
</div>
</body>
</html>

如何将这些值中的每一个放入要在控制台日志中输出的变量中？

我希望能够添加由class data-01 + data-02（15500）标记的值。出于某种原因，控制台中只显示data-01。

答案
querySelectorAll（）需要

此

'span.data-01', 'span.data-02'

应该是这个

'span.data-01, span.data-02'

Answer 1

只需遍历结果并获取文本节点的nodeValue：

var data = document.querySelectorAll('span.data-01,span.data-02');
var sum=0;
for (var i=0;i<data.length;i++) {
    console.log(data[i].className + " " + data[i].childNodes[0].nodeValue);
    sum=sum + parseFloat(data[i].childNodes[0].nodeValue);
}

或者：

var data = document.querySelector('div.info').childNodes;
var sum = 0;
for (var i = 0; i < data.length; i++) {
    if (data[i].nodeType == 1) {
        console.log(data[i].className + " " + data[i].childNodes[0].nodeValue);
        sum = sum + parseFloat(data[i].childNodes[0].nodeValue);
    }
}

Answer 2

怎么样：

var data = document.querySelectorAll('span.data-01, span.data-02');

使用querySelectorAll从多个选择中获取值

2 个答案: