JS:用链接替换链接.还有一个链接

JS: Replace a link with a link. And that link with a link

本文关键字：链接 有一个 替换 JS      更新时间：2023-09-26

我要制作一个文本块，这样，如果你点击一个单词，它就会被一个词汇替代品取代。

例如，"猫的痛苦"是"厌恶动物"的词汇替代品，因为如果在任何文本中用前者代替后者，其含义都不会改变。

然而，我在替换元素的innerHTML所需的功能方面遇到了问题，即使在这个早期阶段也是如此。

下面是一个示例，也是这个函数的大致想法：

<!DOCTYPE html>
<html>
<body>
<p><a href="#" id="Test_1" onclick=" replace(id,'Replacement 1') ">Test 1</a></p>
<p><a href="#" id="Test_2" onclick=" replace(id,'Replacement 2') ">Test 2</a></p>
<script>
function replace(x, y) {
    document.getElementById(x).innerHTML = y;
}
</script>
</body>
</html>

（当我把它作为.html文件保存到我的桌面上时，这是有效的，但由于某种原因，它不在jsfiddle上（否则我会把你链接到它。）

我想让你给我看修改后的代码，这样如果我点击"测试1"，我就会得到"替换1"。然后如果我点击"替换1"，我会得到"ReReplacement 1"。

我相信，我目前遇到的问题与转义字符有关。

所以，如果你的回答能说明我在这方面的总体错误，我将不胜感激。谢谢

***EIDT***

这个或其他作品

<a href="#" id="Test_1" onclick=" replace('Test_1','Replacement 1') ">Test 1</a>

我做到了这一点，但公平地说，即使使用您的基本代码，我也永远不会得到您所说的错误。我使用data-replaced属性来确定是否已经调用了replace。我添加了第三个参数，以防以后更改字符串。如果没有，只要您看到prefix，就用您想要使用的字符串文字来更改它。

<body>
<p><a href="#" id="Test_1" onclick=" replace(this.id,'Replacement 1','Re') ">Test 1</a></p>
<p><a href="#" id="Test_2" onclick=" replace(this.id,'Replacement 2','Re') ">Test 2</a></p>
<script>
function replace(x, y, prefix) {
  var el = document.getElementById(x);
  var replace_text = y;
  if(el.getAttribute('data-replaced')!=='true'){
    	el.setAttribute('data-replaced',true);
    }else{
     	replace_text = prefix+el.innerHTML;
    }
  
  el.innerHTML = replace_text;
}
</script>
</body>

相关文章：