Question

我遇到了html和js的问题。我不知道为什么我只能使用位于顶部的第一个document.getElementById。

JavaScript.js

var one = "sentence"
document.getElementById("text").innerHTML = one;

var two = "sentence sentence"
document.getElementById("text_2").innerHTML = two;

var three = "sentence sentence sentence"
document.getElementById("text_3").innerHTML = three;

webpage.html

<html>
<head>
</head>
<body>
<div id="text"></div>
</body>
</html>
<script src="test.js"></script>

使用div id =＆＃34; text_2＆＃34;或div id =＆＃34; text_3＆＃34;，输出中不会出现任何内容。只能在网页上看到js文件中位于顶部的document.getElementById。所以我猜我不能使用多个getElementById，但我还不知道另一种方式。怎么办？

谢谢

Answer 1

var sentence1 = 'sentence',
    sentence2 = 'sentence two',
    sentence3 = 'sentence three',
    el1 = document.getElementById('text'),
    el2 = document.getElementById('text_2'),
    el3 = document.getElementById('text_3');

if (el1) {
    el1.innerHTML = sentence1;
}

if (el2) {
    el2.innerHTML = sentence2;
}

if (el3) {
    el3.innerHTML = sentence3;
}

Answer 2

我想要的是，有时候我只需要＆＃34; text＆＃34;另一次是text_2，对于text_3也是如此。

这很简单，只需将您想要的任何一个放在一个可以传递给getElementById的变量中。类似的东西：

var elementId;
if (conditionForText) {
    elementId = "text";
} 
else if (conditionForText2) {
    elementId = "text_2"
}
else if (conditionForText3) {
    elementId = "text_3"
}
// Note: you might want to handle the case where none of the above conditions 
// evaluate to true

document.getElementById(elementId).innerHTML = someText

不清楚你想要选择的元素是否应该获得相同的文本，但如果你有几个id需要设置几个不同的字符串，你可以用对象映射它们：

var elementsAndStrings = {
    text : "sentence one",
    text_2 : "sentence two",
    text_3 : "sentence three"
};

现在你可以这样做：

document.getElementById(elementId).innerHTML = elementsAndStrings[elementId];

Answer 3

<强> HTML

<div class="text">Text1</div>
<div class="text">Text2</div>
<div class="text">Text3</div>
<div class="text">Text4</div>

<强>的Javascript

function getElementByClass (className, parent) {
  parent || (parent = document);
  var descendants= parent.getElementsByTagName('*'), i=-1, e, result=[];
  while (e=descendants[++i]) {
    ((' '+(e['class']||e.className)+' ').indexOf(' '+className+' ') > -1) && result.push(e);
  }
  return result;
}
texts= getElementByClass("text");
var txtVal="";
for (i = 0; i < texts.length; i++) {
    txtVal += texts[i].innerHTML  + ", ";
}
alert (txtVal);

DEMO

Answer 4

http://jsfiddle.net/mt78j5m0/

<div id="text_1"></div>
<div id="text_2"></div>
<div id="text_3"></div>

var text = {};

text.text_1 = "One";
text.text_2 = "Two";
text.text_3 = "Three";

var divs = document.querySelectorAll("[id^='text']");

for (var div of divs) {
    div.innerHTML = text[div.id];
}

Answer 5

怎么样：

True

如何使用多个document.getElementById＆＃39; s？

5 个答案: