javascript - 排序 HTML ul

Question

所以我的问题是可以在强标签中按数字对列表项进行排序，当我尝试使用下面的 JavaScript 代码对数字进行排序但将它们从 div 标签中取出时。 (我使用这些 js 代码按名称排序，当 b = ...(LI) 时它工作正常) HTML:

<section>
<button class="sortbynum" onclick="sortListNum()">Sort By Num</button>
<ul id="sort">
    <li> 
       <div><h2>Name</h2></div>  
       <a href=""><img src=""/></a> 
       <div><span>Something:...</span></div>
       <div><span>something:...</span></div>
       <div><span>HHJS: <strong class="sortNum">456</strong></span></div>
    </li>
    <li>again</li>
</ul>

JavaScript:

function sortListNum() {var list, i, switching, b, shouldSwitch, dir,switchcount = 0;list = document.getElementById("sort");switching = true;dir = "asc"; while (switching) {switching = false;b = list.getElementsByClassName("sortNum");
for (i = 0; i < (b.length - 1); i++) {
  shouldSwitch = false;
  if (dir == "asc") {
    if (b[i].innerHTML.toLowerCase() > b[i + 1].innerHTML.toLowerCase()) {
      shouldSwitch= true;
      break;
    }
  } else if (dir == "desc") {
    if (b[i].innerHTML.toLowerCase() < b[i + 1].innerHTML.toLowerCase()) {
      shouldSwitch= true;
      break;
    }
  }
}
if (shouldSwitch) {
  b[i].parentNode.insertBefore(b[i + 1], b[i]);
  switching = true;
  switchcount ++;
} else {
  if (switchcount == 0 && dir == "asc") {
    dir = "desc";
    switching = true;
  }
}}}

Answer 1

我已经设法从中推断出您在询问是否可以从内联元素中提取文本。

您可以像选择其他任何东西一样选择它们，但更有趣的是。

innerHTML 返回 HTML，它可以是 HTML 或纯文本或两者兼而有之。

innerText 返回纯文本。

textContent 返回连接成一个字符串的所有包含的纯文本，仅当下一个元素在新行上时才用换行符分隔。

由于元素中的文本不仅仅是数字，只需选择 strong 标记并调用 innerText:

document.querySelector('#sort .sortNum').innerText