Question

我想根据元素中的哪个单词来更改显示的图像，该单词会经常更改。我尝试使用indexOf方法来尝试查找关键字，该关键字将决定是在元素1还是元素2中显示特定图像，但是没有运气。

<div class="main>
    <h1 id="nextGame" onLoad="nextGames()">Aug 25, 2019: Home against Genoa</h1>
    <p id="homeTeam"><img src="" id="teamHome"> vs <img src="" id="teamAway"></p>
</div>


<script>
var nextGame1 = document.getElementById("nextGame").indexOf("Home");
 if (nextGame1 !== -1); {
    document.getElementById("homeTeam").src = "asroma2.png";
 } else { 
    document.getElementById("teamAway").src = "asroma2.png";
 }
</script>

我希望代码能够查看元素“ nextGame”中是否包含字符串“ Home”。如果是这样，则将“ homeTeam”的图像源更改为我指定的src，否则将为“ teamAway”分配src。

显然不是这样。有人知道我做错了吗？

Answer 1

我认为您想使用类似的东西

var nextGame1 = document.getElementById("nextGame").innerText.indexOf("Home");

Answer 2

使用document.getElementById（“ nextGame”）将产生完整的HTML标记，而不是标记中的文本。您可以使用document.getElementById（“ nextGame”）。innerText来获取标签内的文本，然后可以使用indexOf运算符来识别其中是否包含“主页”。完整的代码将编写如下：

<div class="main>
  <h1 id="nextGame" onLoad="nextGames()">Aug 25, 2019: Home against Genoa</h1>
  <p id="homeTeam"><img src="" id="teamHome"> vs <img src="" id="teamAway"></p>
</div>


<script>
 var nextGame1 = document.getElementById("nextGame").innerText.indexOf("Home");
 if (nextGame1 !== -1) {
     document.getElementById("homeTeam").src = "asroma2.png";
 } else { 
     document.getElementById("teamAway").src = "asroma2.png";
 }
</script>

您还用分号关闭了if语句，并在末尾使用了另外一个右括号，这两个都将引发语法错误。

根据元素中的单词更改图像src

2 个答案: