Created
July 28, 2022 20:28
-
-
Save Tijani-zainab/38dd3d1bc290be022347774cbb585869 to your computer and use it in GitHub Desktop.
simple JavaScript function that hides certain parts of a specified message
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>assignment</title> | |
</head> | |
<body> | |
<form> | |
<input id="message" type="text"/> | |
<input id="message-tohide" type="text" placeholder="type text to hide"/> | |
<input id="custom-replace" type="text" placeholder="specify char"/> | |
<button type="button" id="redact-btn">hide text</button> | |
</form> | |
<div id="display-redacted" style="border: 5px solid rgb(140, 172, 140); width: 500px; height: 100px; margin-top: 10px;"> | |
</div> | |
</body> | |
<script src="redact-js-program.js" defer></script> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let writeMessage; | |
let ArrToHide; | |
let specifyChar; | |
let displayDiv = document.getElementById("display-redacted"); | |
const redactBtn = document.getElementById("redact-btn"); | |
redactBtn.addEventListener('click', function handleRedact(event) { | |
event.preventDefault(); | |
writeMessage = document.getElementById("message").value; | |
specifyChar = document.getElementById("custom-replace").value; | |
ArrToHide = document.getElementById("message-tohide").value.split(' '); | |
ArrToHide.forEach(element => { | |
const regex = new RegExp(element, "gi"); | |
writeMessage = writeMessage.replace( regex, specifyChar); | |
//writeMessage = writeMessage.replace( regex, if(specifyChar === null) {regex, "***"}); | |
}); | |
displayDiv.innerHTML = writeMessage; | |
const resetInputs = document.querySelectorAll('#message, #message-tohide, #custom-replace'); | |
resetInputs.forEach(input => { | |
input.value = ''; | |
}); | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
#Assignment