Learn how to remove square brackets from string javascript. Remove Multiple Square brackets.
In today’s articles, I will show you how you can use the “replace” function which is provided by JavaScript to replace text patterns from the text.
Examples
Example #1: Remove square brackets from string javascript.
In the first example, I will show you how you can simply replace square brackets. for showing this I will define a variable and will add text to it with square brackets, after that I will write code to replace only square brackets(“[“, “]”) from it.
<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
<h1>Example of removing Square bracket from string.</h1>
<br />
<h2>Before</h2>
<h3>This text contains square [ brackets</h3>
<h2>After</h2>
<h3>This text contains square brackets</h3>
<script>
var Text = "This text contains square [ brackets";
function ReplaceSquareBrackets()
{
alert(Text.replace('[', ''));
}
ReplaceSquareBrackets();
</script>
</body>
</html>
In the above code I have taken a variable with before text(which contains a square bracket) after that I have written a function that will display an alert message with after text (Which is without a square bracket). for performing this I have used replace function which is provided by JavaScript.
In the above example you can use both square brackets (“[“, “]”).
Let’s move to another example.
Example #2: Remove square brackets (Multiple) from string javascript.
Below the example, I will show you how you can use replace with multiple square brackets.
<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
<h1>Example of removing Square bracket from string.</h1>
<br />
<h2>Before</h2>
<h3>[Demo Text]</h3>
<h2>After</h2>
<h3>Demo Text</h3>
<script>
var Text = "[Demo Text]";
function ReplaceSquareBrackets()
{
alert(Text.replace(/[\[\]]+/g,''));
}
ReplaceSquareBrackets();
</script>
</body>
</html>
In the above code I have used replace with regular expression, which will replace the square bracket from the text and your text will be visible correctly.
Here I have declared variable Text which contains before text and in the alert box, I am showing after the text. If you want to customize it you can customize it as per your requirement. Now I am moving to the next example.
Example #3: Remove square brackets (Multiple) from string using javascript (part 2).
In this example, I will use a little bit of complex before text for replacing it. you can check the below image for an example.
<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
<h1>Example of removing Square bracket from string.</h1>
<br />
<h2>Before</h2>
<h3>['Hello', 'Demo 1', 'Demo 2']</h3>
<h2>After</h2>
<h3>Hello, Demo 1, Demo 2</h3>
<script>
var Text = "['Hello', 'Demo 1', 'Demo 2']";
function ReplaceSquareBrackets()
{
alert(Text.replace(/[\[\]\']+/g,''));
}
ReplaceSquareBrackets();
</script>
</body>
</html>
The above example is a little bit complex as compared to the previous one, here I have used the regular expression “/[[]\’]+/g,” for the previous example. This pattern will replace the square bracket and ” ‘ ” from the text provided by you.
In the above code before text is stored in a variable and after that Text variable is used to replace the function of JavaScript it will replace the square bracket and ” ‘ ” from it. As already mentioned we are using JavaScript for that.
Example #4: Remove square brackets from string on button click using javascript.
Sometimes you have to perform this square bracket replace task with a button click, for solving this I will show you how you can do it with a button click.
Here I will take a button and will perform replace task whenever anyone clicks on the button.
<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
<h1>Example of removing Square bracket from string on button click.</h1>
<br />
<h2>Before</h2>
<h3>['Hello', 'Demo 1', 'Demo 2']</h3>
<h2>After</h2>
<h3>Hello, Demo 1, Demo 2</h3>
<div>
<input type="button" name="" value="Click Here to replace text" onclick="ReplaceSquareBrackets()">
</div>
<script>
var Text = "['Hello', 'Demo 1', 'Demo 2']";
function ReplaceSquareBrackets()
{
alert(Text.replace(/[\[\]\']+/g,''));
}
</script>
</body>
</html>
In the above example, ReplaceSquareBracketsfunction will be called whenever anyone clicks on the button. I have already added replace code in that function so automatically square brackets will be removed from the declared text and you will get desired output from that. You will get output in the alert message as I have written code to display output in an alert box.
The pattern which I have used for replacing the square bracket is already explained in the earlier example, so I am not explaining it again.
Example #5: Remove square brackets from textbox and display it.
In this example, I will take input from the user and will replace the square bracket from the text which is entered by the user.
In this example, user will enter his own text which contains square brackets and square brackets will be removed from it. let’s check the below example.
<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
<h1>Example of removing Square bracket from string on button click.</h1>
<br />
<input type="text" name="txtUserInput" id="txtUserInput" >
<div>
<input type="button" name="" value="Click Here to replace text" onclick="ReplaceSquareBrackets()">
</div>
<script>
function ReplaceSquareBrackets()
{
alert((document.getElementById('txtUserInput').value).replace(/[\[\]\']+/g,''));
}
</script>
</body>
</html>
In the above example, I have written the code of the textbox where the user will enter text, and after that user will press the button to replace the text. After pressing the button square brackets will be removed from the text and after the message will be displayed in an alert box.
Share this article in your technical groups where people will have need of this.
If you want more examples like this then please comment I will try to add more examples in this article.
If you have any suggestions then you can write in the comment section.
### Settimeout JavaScript | Best 9 Settimeout JavaScript Examples