我也曾发布过一个类似的关于切换HTML文本片段的问题(参见JS Switch HTML content based on specific text included in h1 tag),这些回复对我帮助很大。从这些回复中,我使用了下面的代码来修改HTML文本片段:
<h1>This is about Red Apples</h1>
<span id="colour"></span>
window.addEventListener("load",function(){
const h1 = document.querySelector("h1"),
description = document.querySelector("#colour"),
colours = [
{ colour: "red", description: "red description" },
{ colour: "blue", description: "blue description" }
]
description.innerText = colours.filter(f => h1.innerText.toLowerCase().includes(f.colour))[0]?.description
},false);
现在我希望修改代码,根据h1标记中包含的一些文本(与我上一篇文章中要求的文本字符串不同)来更改img src。
经过大量的试验和错误,我不知道如何修改这段代码来改变同一页上的图像源代码。到目前为止,我得到的最接近的,但使用"if/else"方法,是:
一个二个一个一个
但是,我还是不能让这个工作。我真的希望有人能帮助!提前感谢!
3条答案
按热度按时间kb5ga3dv1#
据我所知,您的代码中有2个错误。
1 -移除
.imageNode
。2 -您需要将文本转换为小写,因为您要获取的对象键是小写的,请使用
.toLowerCase()
e1xvtsh32#
这应该对你想要达到的目标有效
6vl6ewon3#
👋
我认为你的例子遗漏了一些地方。
1.您仍然需要某种事件侦听器来检查DOM是否完全加载,然后再尝试获取
document.getElementById
元素的句柄(或者将JS脚本放在dom下面)。influenceImage
名称非常模糊,并没有按照名称所暗示的那样做。这里有把小提琴给你玩。
https://jsfiddle.net/xjL79zef/1/