Javascript 从表单中获取数据，然后更改出现的单词并打印结果

所以我得到了这个表格：

<form action="/my-handling-form-page" method="post">

    <div>
        <label for="name">Text:</label>
        <input type="text" id="data" />
    </div>

    <div class="button">
        <button type="submit">Input</button>
    </div>

</form>

正文：
输入

我想做的是把已经提交的数据拿出来，然后如果提交的文本中有“good”一词，我需要它改为“great”，然后在相同或不同的页面上打印。如果有人能帮我用javascript实现这一点，那就太好了。

<script type="text/javascript">
function fnc()
{
    data=document.getElementById("data").value;
    if(data=='good')
    {document.getElementById("data").value='great';
    alert(document.getElementById("data").value);}
    return true;
}
</script>
<form action="/my-handling-form-page" method="post" onsubmit="return fnc()">

函数fnc（）
{
数据=document.getElementById（“数据”）.value；
如果（数据==‘良好’）
{document.getElementById（“数据”）.value='great'；
警报（document.getElementById（“data”）.value）；}
返回true；
}

尝试以下方法：

正文：
提交
函数replaceWord（）{
var dataElem=document.getElementById（“数据”）；
变量数据=数据元素值
数据=数据。替换（“好”、“好”）；
dataElem.value=数据；
返回false；
}
​

---

希望这有帮助。

您需要优化代码。例如，在本例中，您强制通过DOM最多3次，这是不好的。我使用了3次只是为了显示值已更改。必须至少使用dom两次，否则使用JQuery。对某人的答案投反对票比阅读并理解为什么使用这样的代码你是大错特错要容易得多。方法getElementById在每次调用它时都通过DOM进行搜索。为了避免重复搜索，必须声明新变量，如：var foo=document.getElementById（“数据”）；foo.value=“无论如何”；投票很容易。JS也是。学习它。@VladislavQulin在分配foo时，它保持dom的状态。因此，即使您执行foo.value，它也像访问DOM一样。你试过使用foo.value吗？使用并查看它是否真的更改了值

  <div>
        <label for="name">Text:</label> 
        <input type="text" id="data" value="good"/> 
  </div> 
    <div class="button"> 
        <button id="submit" onclick="replaceWord()">Submit</button>
   </div>
<script type="text/javascript">
function replaceWord(){
    var dataElem = document.getElementById("data");
    var data = dataElem.value
    data = data.replace("good", "great");
    dataElem.value=data;
    return false;
}
</script>​