This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 1 year ago.
I want to remove element with data-loc-id='2218'. How can I do this?
I tried this:
document.querySelectorAll(`[data-loc-id='2218']`).remove();
Error: Uncaught TypeError: document.querySelectorAll(...).remove is not a function
querySelectorAll() returns collection, you should loop through them and remove one by one:
document.querySelectorAll(`[data-loc-id='2218']`).forEach(el => el.remove());
OR: If you have single element with the attribute value then use querySelector() which returns the first matched element in the document:
document.querySelector(`[data-loc-id='2218']`).remove();
Related
This question already has answers here:
Select all elements with a "data-xxx" attribute without using jQuery
(8 answers)
Find an element in DOM based on an attribute value
(11 answers)
How to get element by class name? [duplicate]
(4 answers)
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 12 months ago.
hey would love to have a take from a more experienced coder about this.
Would appreciate if you could give it to me in the below code format, thanks a lot
You could use document.querySelectorAll.
This returns a Node List, to convert that to an Array, you could do
const elements = [...document.querySelectorAll(".my-selector")];
That's called Vanilla Javascript
An example
var myArray = document.getElementsByClassName('myClass')
myArray will be a HTMLCollection
This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 1 year ago.
function open() {
document.getElementsByClassName("nav").style.display='flex';}
I have tried several times to display the items but can't resolve it ,I hope someone
helps thanks in advance!!
document.getElementsByClassName("nav")
The getElementsByClassName method of Document interface returns an
array-like object of all child elements which have all of the given
class name(s). When called on the document object, the complete
document is searched, including the root node. You may also call
getElementsByClassName() on any element; it will return only elements
which are descendants of the specified root element with the given
class name(s).
you probably need to do the following (assuming you only have one element with class name as nave):
(document.getElementsByClassName("nav")[0]).style.display='flex';
This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 2 years ago.
I want to assign the date to a variable I have tried with
var $x = document.getElementsByTagName("span").innerHtml but this assigns null value
You can get value with selector too.
document.querySelector("{SELECTOR}").innerHTML;
You can copy any selector with right click from Chrome Developer Console.
This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 9 years ago.
In this code:
<header class="alg">Some text</header>
<script>
var header = document.getElementsByClassName("alg");
header.style.color = 'red';
</script>
after run it. I got from log:
TypeError: header_m.style is undefined
What do I do wrong?
getElementsByClassName returns multiple elements.
Therefore, you are accessing it improperly. What you want, in this case, is:
header[0].style.color = 'red';
// ^ [0] will get the first element with the class,
// which is in this case your is header element. [1] would get the second, etc.
jsFiddle.
This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 2 years ago.
I'm just curious about a certain scenario:
If I want to submit a form using getElementById using the following code below:
document.getElementById("form_id").submit();
it works fine. However, trying similar code using getElementsByName in the code below:
document.getElementsByName("form_name").submit();
doesn't work, although there is only a single element with this name: form_name.
So my question is?
Is it possible to submit a form using getElementsByName, or do I need to give an id to all of my forms.
Thanks!
document.getElementsByName returns an array, so you need to access it with the array index notation:
document.getElementsByName("form_name")[0].submit();