JavaScript getElementByID是否有任何短方法可以完成相同的工作？

我下面的代码工作得很好，但我想知道，是否有任何简单的方法只通过JavaScript完成相同的工作

<lable for="fstValue"></lable> First number is: <input type="text" id="fstValue" value="" />
<lable for="sndValue"></lable> Second number is: <input type="text" id="sndValue" value="" />
<hr>
<div id="showResult1"></div>
<div id="showResult2"></div>
<div id="showResult3"></div>
<div id="showResult4"></div>

<button onclick="sandeep()">Check Result</button>

---

阵列当然可以驱动这个。请注意我的

parseInt（*，10）

，这很重要

var a = parseInt(document.getElementById("fstValue").value, 10);
var b = parseInt(document.getElementById("sndValue").value, 10);

var texts = ["Plus", "Minus", "Multiple", "Divide"];
var results = [a + b, a - b, a * b, a / b];

for(var i = 0; i < 4; i++ ) {
    document.getElementById("showResult" + (i+1) + ").innerHTML=" texts[i] + " is " + results[i];
}

var a=parseInt（document.getElementById（“fstValue”）.value，10）；
var b=parseInt（document.getElementById（“sndValue”）.value，10）；
变量文本=[“加”、“减”、“乘”、“除”]；
var结果=[a+b，a-b，a*b，a/b]；
对于（变量i=0；i<4；i++）{
document.getElementById（“showResult”+（i+1）+”）.innerHTML=“text[i]+”是“+results[i]；
}

注意，您正在发现Angular.js等框架试图解决的问题。注意以下是伪代码。如果您有一段HTML模板，肯定会更好

<p>{text} is {result}</p>

{text}是{result}

你可以把它放在一个循环中

{{iterate over results object}}
    <p>{result.text} is {result.results}</p>
{{ end iterate}}

{{迭代结果对象}
{result.text}是{result.results}

{{end iterate}}

---

现在，在Javascript中需要做的工作要少得多。但更重要的是，应该在HTML中进行的工作现在在HTML（数据布局）中进行，而在JS中进行的工作应该在JS（获取数据）中进行。这是最先进的理论。

您至少可以制作自己的功能：

function getElement(id)
{
    return document.getElementById(id);
}

现在您可以只使用

getElement（“showResult1”）

---

您还可以对innerHtml和其他在代码中重复的内容执行相同的操作。

当然可以。我想这是以更好的方式重写的。下面是代码审查，标记迁移对于已经完成的堆，再进行一次编辑：结果数组中缺少一个逗号；）非常感谢您的代码和建议。我将继续在我的项目中实现这个过程。@user1758831您也可以通过投票来感谢。（这是值得鼓励的）

function getElement(id)
{
    return document.getElementById(id);
}