从 div 元素中删除单词

Question

我正在创建一个强制具有桌面图标的操作系统环境。 这些图标由数字的 id 和图标 label 由其数字和值文本标识。

当我右键单击任何图标时，我的上下文菜单会出现，这会获取单击的图标的 id，并将图标的名称和单词图标添加到菜单顶部，以便您可以识别单击了哪个图标。

当我单击菜单中的链接（如打开）时，我需要重新使用菜单 header 文本减去单词图标，以便我可以通过其 label 重新定位此图标来执行任务。

这是我找到图标的方法。

function LocateIcon(Icon) 
{
if (Icon <= document.getElementById('IconsTotal').innerHTML)
{
if (document.getElementById('WI'+Icon+'Text').innerHTML == document.getElementById('ContextMenuStatus').innerText)
{
return Icon;
} else {
LocateIcon(+Icon +1);
}
} else {
AlertBox('No match found.');
}
}

你可以在这里看到一个例子： http://www.stepnageos.com

当您将鼠标悬停在图标上时，我通过更新代码来实现这一点。 我的问题是，当菜单处于活动状态时，将鼠标放在另一个图标上会更改值，因此选项不会与原始图标相关。

这就是为什么我需要使用打开菜单中的值。

Answer 1

您可以在 HTML 中导入 jQuery 并使用$("div").replaceWith("about") ，将单词替换为 about。

 $("div").replaceWith("about")

 <div>about icon</div> <script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>

Answer 2

您可以通过引用元素并直接将属性设置为新文本来编辑元素的innerHTML ，如下所示：

let div = document.getElementById('container');

div.innerHTML = 'About';

这是一个快速的repl.it ！