Is there a way to replace specific text in an HTML5 document?
Let's say the user inputs: My name is Toni.
I want to change the output text "Toni" to Ani, so the final output is: "My name is Ani".
This is the current code I have:
<title>textBoxes.html</title>
<script type = "text/javascript">
// from textBoxes.html
function repleace(){
var txtName = document.getElementById("txtName");
var txtOutput = document.getElementById("txtOutput");
var name = txtName.value;
if(name == "toni"){
name = "ani";
}
txtOutput.value = name;
}
</script>
<link rel = "stylesheet"
type = "text/css"
href = "textBoxes.css" />
</head>
<body>
<h1>Text Box Input and Output</h1>
<form action = "">
<fieldset>
<label>Type your name: </label>
<input type = "text"
id = "txtName" />
<input type = "button"
value = "GO"
onclick = "repleace()"/>
<input type = "text"
id = "txtOutput" />
</fieldset>
</form>
</body>
</html>The issue with this code is that it only replaces the text when "Toni" is inputted directly, not within a sentence like "My name is Toni."