这段javascript代码能写得优雅吗？答案

【问题标题】：Can this javascript code be written elegantly?这段javascript代码能写得优雅吗？
【发布时间】：2020-03-28 05:11:08
【问题描述】：

由于我是 javascript 新手，谁能帮助我优雅地编写这段代码。我正在将它添加到 wordpress，所以我已经尝试了 jquery，但由于某种原因它不起作用，所以我尝试了这种可行的方法，但我不喜欢它的编写方式。

如果有人可以帮助我以更好的方式写作，那就太好了。谢谢！

var par01 = document.getElementById("tt-insights-home").getElementsByClassName("excerpt")[0].innerHTML;
var par02 = document.getElementById("tt-insights-home").getElementsByClassName("excerpt")[1].innerHTML;
var par03 = document.getElementById("tt-insights-home").getElementsByClassName("excerpt")[2].innerHTML;
var slicedPar01 = par01.slice(0, -17);
var slicedPar02 = par02.slice(0, -17);
var slicedPar03 = par03.slice(0, -17);
 document.getElementById("tt-insights-home").getElementsByClassName("excerpt")[0].innerHTML = slicedPar01;
 document.getElementById("tt-insights-home").getElementsByClassName("excerpt")[1].innerHTML = slicedPar02;
 document.getElementById("tt-insights-home").getElementsByClassName("excerpt")[2].innerHTML = slicedPar03;

【问题讨论】：

获取对元素的引用一次，而不是多次。

标签： html slice innerhtml getelementbyid

【解决方案1】：

我只是循环浏览摘录，然后您不会只对 3 个摘录进行硬编码：

var home = document.getElementById("tt-insights-home");
var excerpts = home.getElementsByClassName("excerpt");

for (i = 0; i < excerpts.length; i++) {
  excerpts[i].innerHTML = excerpts[i].innerHTML.slice(0, -17);
}

【讨论】：

太棒了！这正是我想要的。谢谢！

【解决方案2】：

可能是这样的：

var excerptElement = document.getElementById("tt-insights-home").getElementsByClassName("excerpt");

excerptElement[0].innerHTML = excerptElement[0].innerHTML.slice(0, -17);
excerptElement[1].innerHTML = excerptElement[1].innerHTML.slice(0, -17);
excerptElement[2].innerHTML = excerptElement[2].innerHTML.slice(0, -17);

【讨论】：

【解决方案3】：

可能是主题的一个小变化 - 顺便说一句，未经测试，但看起来不错。

let insights=document.getElementById( 'tt-insights-home' )
Array.from( insights.querySelectorAll('excerpt') ).foreach( node =>{
    node.textContent=node.textContent.slice(0,-17)
})

【讨论】：