Javascript 在表内部使用QuerySelector避免for循环
我试图用queryselectoral从表中获取每行多条记录的列表，但我尝试了一种方法，但被困在了一个multiple for循环中 我想知道是否有更合适的方法来解决querySelectorAll函数的这个特定问题 到目前为止，我所尝试的： 迄今为止从以下位置提取的Html：Javascript 在表内部使用QuerySelector避免for循环,javascript,Javascript,我试图用queryselectoral从表中获取每行多条记录的列表，但我尝试了一种方法，但被困在了一个multiple for循环中 我想知道是否有更合适的方法来解决querySelectorAll函数的这个特定问题 到目前为止，我所尝试的： 迄今为止从以下位置提取的Html：var innerT=t2[i]。单元格 t2=document.querySelectorAll（'.flexible.block_xp-report-table tbody tr'）； 对于（变量i=0；i
var innerT=t2[i]。单元格
t2=document.querySelectorAll（'.flexible.block_xp-report-table tbody tr'）；
对于（变量i=0；i
S.N
名称
水平仪
指向
6.
6,414
xp
----我只知道href的值
6--我只需要这个号码
6414--我只需要这个号码
xp
---这个tr将继续扩大---
您也可以在html对象上使用querySelector
（类似于querySelectorAll
，但只返回第一个匹配元素）。因此t2[i].querySelector（'.c1a'）
将返回a
insidetd
中的c1
类t2[i]
。然后使用.getAttribute（'href'）获取href
值
同样使用t2[i].querySelector（'.pts'）.innerText
使用classpts
在t2[i]
内部获取div
。使用innerText
从div
获取text
在下面试试
var t2=document.querySelectorAll（'.flexible.block_xp-report-table tbody tr'）；
对于（变量i=0；i
S.N
名称
水平仪
指向
6.
6,414
6.
6,414
是否要从td
获取文本
？请分享你完整的表格
结构
。好的，我会用完整的表格更新。@Karan用表格结构和我想要的东西更新了我的帖子这里没有循环，纯粹的函数迭代谢谢你，我喜欢答案，我错过了问题中的一点我可以更新问题吗，只有一个div，在class.pts
下面？我在外面，用手机打字。希望下面的工作。返回{href:getFor（'href'）.querySelector（“a”）.getAttribute（“href”），text:getFor（'text'）.innerText，points:getFor（'points'）.querySelector（.pts”）.innerText}）
<body onload="init()">
<!--[if lt IE 7]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="#">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<table class="block_xp-report-table">
<tbody>
<tr class="" id="block_xp_report_r0">
<td class="cell c0" id="block_xp_report_r0_c0">
1
</td>
<td class="cell c1" id="block_xp_report_r0_c1">
<a href="http://test.com.np/user/view.php?id=2157&course=103"
id="yui_3_17_2_1_1596532113936_188"
data-attribute="-- need to get the href value from here not the name">John</a>
</td>
<td class="cell c2" id="block_xp_report_r0_c2" data-attribute="---need to get this text ">6</td>
<td class="cell c3" id="block_xp_report_r0_c3">
<div class="block_xp-xp">
<div class="pts" data-attribute="---need to get this text ">6,414</div>
</div>
</td>
</tr>
<tr class="" id="block_xp_report_r1">
<td class="cell c0" id="block_xp_report_r1_c0">
<a href="http://test.com.np/user/view.php?id=2158&course=103">Image 1</a>
</td>
<td class="cell c1" id="block_xp_report_r1_c1">
<a href="http://test.com.np/user/view.php?id=2158&course=103"
id="yui_3_17_2_1_1596532113936_188">John</a>
</td>
<td class="cell c2" id="block_xp_report_r1_c2">6</td>
<td class="cell c3" id="block_xp_report_r1_c3">
<div class="block_xp-xp">
<div class="pts">6,414</div>
</div>
</td>
</tr>
</tbody>
</table>
<script>
function init() {
const rowIndexes = {
href: 1,
text: 2,
points: 3
}
const responses = Array.from(document.querySelectorAll('.block_xp-report-table tbody tr'))
.map(res => {
const getFor = (elemName) => {
return res.querySelectorAll("td")[rowIndexes[elemName]]
}
return { href: getFor('href').querySelector("a").getAttribute("href"), text: getFor('text').innerText, points: getFor('points').innerText }
})
console.log(responses)
}
</script>
</body>
[{"href":"http://test.com.np/user/view.php?id=2157&course=103","text":"6","points":"6,414"},{"href":"http://test.com.np/user/view.php?id=2158&course=103","text":"6","points":"6,414"}]