What is the best way to eliminate a specific value from an array in Java Script?

Question

What is the best way to eliminate a specific value from an array in Java Script?

<code>
<!DOCTYPE html>
<html>
<head>
<title>Manipulating JavaScript Arrays</title>
<script type="text/javascript">

var strArray = ["Yallappa","Rajesh","Kiran"];
function displayArray(){
document.getElementById("Array").innerHTML = strArray;
}

function addButtonClick(){

strArray.push(document.getElementById("TextBox").value);
document.getElementById("Array").innerHTML = strArray;
}

function removeButtonClick(){
var index = strArray.indexOf(document.getElementById("Array").value);
alert(index);
if(index > -1){
strArray.splice(document.getElementById("Array").value,1);
}
document.getElementById("Array").innerHTML = strArray;
}

</script>
</head>
<body onLoad="displayArray()">
<h2 id="Array"></h2><br>
<input type="text" id="TextBox"/><br>
<input type="button" onclick="addButtonClick()" text="Push into Array" value="Push into Array"/><br>
<input type="button" onclick="removeButtonClick()" text="Remove from Array" value="Remove From Array"/>

</body>
</html>
</code>

I am trying to manipulate an array using JavaScript functions. I can successfully add new strings to the array, but I am facing difficulty removing strings. Can someone please help me understand why this is happening?

javascript

Answer 1

Answer №1

When updating the But2Click function, make sure to change arrstr to ArrStr and indx to Indx. The But2Click function contains several errors that need to be corrected. Please see the corrected version below:

function But2Click(){
            var Indx = ArrStr.indexOf(document.getElementById("TxtBox").value); // Ensure correct id for the text box
            alert(Indx);
            if(Indx > -1) {
                ArrStr.splice(Indx,1); // Index should be passed as the first argument for the splice function
            }
            document.getElementById("Arr").innerHTML = ArrStr; // Correct id for the element and variable name case
        }

Answer 2

When updating the But2Click function, make sure to change arrstr to ArrStr and indx to Indx. The But2Click function contains several errors that need to be corrected. Please see the corrected version below:

function But2Click(){
            var Indx = ArrStr.indexOf(document.getElementById("TxtBox").value); // Ensure correct id for the text box
            alert(Indx);
            if(Indx > -1) {
                ArrStr.splice(Indx,1); // Index should be passed as the first argument for the splice function
            }
            document.getElementById("Arr").innerHTML = ArrStr; // Correct id for the element and variable name case
        }

What is the best way to eliminate a specific value from an array in Java Script?

Answer №1

Similar questions

Encountering yet another frustrating issue with z-index not functioning properly in versions of IE above 7, despite extensive research yielding no solution

What is the best way to sort through an array depending on a specific sequence of elements provided

Fusion: Combination of Drop-down Menu, Inactive Text Field, and Database Data Retrieval

Adjust the text according to the selected checkbox option

Why is my AngularJS application triggering two events with a single click?

Identify and troubleshoot scripts that are included in the response returned by Chrome

Error message: Unexpected token discovered, Functioned correctly on Windows yet encountering issues on the VPS. Any suggestions for resolving this?

After the form is successfully submitted, you can remove the required attribute

The functionality of Vue JS v-attr="expression1 && exp2 && exp3" seems to be malfunctioning

Switching out the background image with a higher resolution one specifically for users with retina devices

JavaScript Looping through multiple files for upload will return the last file in the series

Guide to incorporating HTML within React JSX following the completion of a function that yields an HTML tag

"Using ng-click to access values from other elements in AngularJS

Is there a more efficient approach to streamline Javascript code similar to the chaining method used in JQuery?

Using Threejs JSONLoader and OOP to easily add models to a scene post-loading

React's router activeClassName feature fails to apply the active class to child routes

SQL - Retrieve information for a specified time frame using a predetermined value

When trying to set up Plaiceholder in a Next.js/Webpack 5 environment, you may encounter the following issue: "Error: Module not found - Can't resolve 'child_process

Having trouble retrieving the recently updated data from the useReducer hook within a function defined in setTimeout

What sets React$Element apart from ReactElement?