This question already has answers here:
Native javascript equivalent of jQuery :contains() selector
(6 answers)
How to get element by innerText
(18 answers)
Closed 4 months ago.
Using jQuery, if I want to grab an element using the text inside it, I can do:
$( "div:contains('John went to the shop')" )
I can find loop functions and the use of XPATH, but nothing similar to jQuery.
Is there something simple like this for querySelector or equivalent methods?
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 does jquery $ actually return?
(9 answers)
Closed 6 years ago.
I have tried to use setAttribute() method in jquery as mentioned below :
$(p).setAttribute('class','first');
However that didn't work so I replaced setAttribute with attr() method.
$(p).attr('class','first');
It worked when I used the above code.
I just want to know why it didn't work when I used setAttribute() and why it worked when I used attr()?
.setAttribute() is a function in javascript works on DOM element where .attr() is a jQuery function works on jQuery object (DOM Object)
you can check it by doing
$(p)[0].setAttribute('class','first');
OR
p.setAttribute('class','first'); // no need to wrap in $
This question already has answers here:
What's the difference between '$(this)' and 'this'?
(7 answers)
Closed 6 years ago.
$(this).append('hello');
The above could be a line nested in some function of jquery. I know that this is a correct line, but I was wondering whether you could mix javascript with jquery and write it down like this.
this.append('hello');
The only difference is that in the second line of code the this keyword is not written inside the jquery method, but this should still work because the this keyword itself automatically stores the location of the node at which the function is aimed. Right? Well apparentely it does not work, so when and why do can't you use the this keyword alone?
The only difference as far as I understand is the wrapper, which is the jQuery object: https://learn.jquery.com/using-jquery-core/jquery-object/. This wrapper exposes jQuery methods on the element, whereas just using this returns the element, but does not expose those same methods. As a simple example, this will return the textContent of the div,
$('div').click(function() {
console.log($(this).text());
})
Where as this will not
$('div').click(function() {
console.log(this.text());
})
This question already has answers here:
document.getElementById vs jQuery $()
(13 answers)
Closed 9 years ago.
Can somebody explain to me what the difference is between these two examples:
var obj = getElementById("id1"); // without jQuery
var obj = $("#id1"); // with jQuery
Is the returned value in both cases the same object?
getElementById() returns a DOM element only, $("#id1") returns a jQuery object containing DOM element(s).
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();