Javascript 从html页面删除随机单词_Javascript_Html

Javascript 从html页面删除随机单词

javascript html

Javascript 从html页面删除随机单词,javascript,html,Javascript,Html,我创建了一个javascript程序，当你点击标题“click here”时，它会从我的数组中一个一个地打印元素，我这里的问题是，当你点击之前打印的单词时，它试图实现一个函数，从html页面中删除一个随机单词，但它会打印其他单词，如何创建删除以前打印的单词的函数 <!DOCTYPE html> <html> <head> <title>function JavaScript</title> <script >

我创建了一个javascript程序，当你点击标题“click here”时，它会从我的数组中一个一个地打印元素，我这里的问题是，当你点击之前打印的单词时，它试图实现一个函数，从html页面中删除一个随机单词，但它会打印其他单词，如何创建删除以前打印的单词的函数

<!DOCTYPE html>

<html>
<head>
    <title>function JavaScript</title>
   <script >
var k = 0;
var ph = ["red ","blue","black","green","yellow"];
function text(){

     if(k < ph.length ){

         document.getElementById("test").innerText+="  "+ ph[k];
            k++;
    }

}

function deleteWord(){

  var number = Math.floor(Math.random() * 5);

   document.getElementById("test").innerText+="  "+ ph[number];



}
   </script>




</head>

<body>

<h1 onclick="text();">Click here</h1>

<span id="test" onclick="deleteWord();"></span>




</body>
</html>


函数JavaScript
var k=0；
变量ph=[“红色”、“蓝色”、“黑色”、“绿色”、“黄色”]；
函数文本（）{
if（k


您的问题是+=运算符在字符串的当前值之后附加“”+ph[number]

要替换，请使用=运算符指定新值。由于要删除，所以只需使用空字符串
  document.getElementById("test").innerText = "";

作为旁注，在字符串中存储多个空格是不常见的。如果您试图移动内容，则应该考虑设置<代码>填充左侧CSS属性。
编辑：如果不想丢失元素的全部内容，可以替换字符串的最后一部分：
  document.getElementById("test").innerText.replace(/   .*$/,"");

document.getElementById（“test”）.innerText=document.getElementById（“test”）.innerText.replace（ph[编号]，”）？我尝试了document.getElementById（“测试”）.innerText=“”；但是它删除了上面我的编辑之前打印的所有单词。它是一个正则表达式，匹配一行中的三个空格加上下面的任何字符，并用空字符串替换它们。您可能会发现更好的设计是使用颜色字符串创建一个全新的元素。使用javascript将其插入其sibing附近的DOM中，并使用css对其进行样式设置。
  document.getElementById("test").innerText.replace(/   .*$/,"");