Home > Back-end >  remove last node or specific node from nodelist without changing class or attribute in html
remove last node or specific node from nodelist without changing class or attribute in html

Time:01-08

Is it possible or is there any logic on how to remove specific node in nodelist? I tried to use pop() out of nowhere thinking that it would work and i just laughed at my self.

Anyway,

I have this nodelist looks like this :

0: input#quesNameMLCTS
1: input#choicesTextAMLCTS
2: input#choicesTextBMLCTS
3: input#choicesTextCMLCTS
4: input#choicesTextDMLCTS
5: input#choicesTextCorrectMLCTS

I want to remove 3 and 5. is there any possible way to do that without modifying in HTML CODE?

Expected output looks like this :

0: input#quesNameMLCTS
1: input#choicesTextAMLCTS
2: input#choicesTextBMLCTS
3: input#choicesTextDMLCTS

CodePudding user response:

There doesn't appear to be any method available to mutate a NodeList (or even an HTMLCollection) unless the collection happens to be live (such that changes to the nodes in the document result in changes to the collection) - so if you want to keep the existing nodes in the document as-is, there's no way to restructure the collection.

That said, it'd be pretty simple to convert it to an array, then change the array however you want.

// Take a NodeList and convert it into an array
const inputs = [...document.querySelectorAll('input')];

// Remove a single element at index 5 from the array
inputs.splice(5, 1);
  • Related