This question already has answers here:
jQuery hasAttr checking to see if there is an attribute on an element [duplicate]
(9 answers)
Closed 5 years ago.
How do I find a certain attribute exists or not for a selected item in jQuery?
For example, selected element jQuery('.button'), now this can have an attribute 'xyz'. How do I get whether it is having that or not?
You can use the hasAttribute method:
// Attach the event to the button
$('button').on('click', function() {
// This will refer the element from where event has originated
if (this.hasAttribute("style")) {
alert('yes')
} else {
alert('no')
}
})
If you want to use the jQuery library, you can directly use the attr method in the if condition.
if($('#yourElement').attr('someProp')){}
Alternatively, you can also use the jQuery is selector:
if ($(this).is('[style]')) {// rest of the code}
DEMO
You have two solutions that I know of. 1) Native Javascript has a function for this .hasAttribute() (e.g. $(this)[0].hasAttribute('name');). 2) Using jQuery, you can check if $(this).attr('name') is undefined or not.
Related
This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 2 years ago.
I have the following piece of code in my javascript file(helper.js):
var a = $('li')
$(window).keydown(function(e) {
\\whatever
})
it is supposed to select all tags in my html file and store in in a, however when I use this code, it a is null(which it shouldn't be). when I change my code to:
$(window).keydown(function(e) {
var a = $('li')
\\whatever
})
a is initialized correctly. Does anyone knows why? I am using jquery 3.3.1.
If you are dealing with the DOM (Document Object Model), use $(document).
If you are dealing with how user interact with the window, screen and so on, use $(window)
Here is a link for better understanding window and document
Window vs Dom
This question already has answers here:
Javascript getElementById based on a partial string
(9 answers)
Closed 3 years ago.
I just want to know to how to use custom varible with javascript.suppose we have 5 id with name zawsz,baws2,tawsx,paws4,vawsa and we want to execute single DOM command to all these element whose id is define here.
document.getElementById("-aws-").onclick=function(){}
Here -aws- define all the id define above.(-) can be replace with any char/int value;
You could use the following code:
(The following code will select all elements of which the id includes aws.
I have tested this code and it works: https://jsfiddle.net/5042woqz/)
document.querySelectorAll('*[id*="aws"]').forEach(function(item) {
item.onclick=function() {
console.log('click!');
};
});
Items will now be an array containing all your aws- items.
If you have further questions, just let me know.
P.S.: You could achieve the same thing really easily with jquery.
You can use document.querySelectorAll for this:
document.querySelectorAll('[id^="aws"]')
That will select all elements where the id attribute starts with (^=) "aws".
This question already has answers here:
How to use JavaScript variables in jQuery selectors?
(6 answers)
Closed 4 years ago.
Im trying to get the value of an html element via Id. I now want to use that value to loop through all the elements with the class from the id.val. How can I search for a variable as a class.
$(".BtnSettings").click(function () {
var Daytime = $("#Daytime").val();
//Here i dont know what to do. Instead of .Daytime I want to search for the var Daytime. Or for $("#Daytime").val() obviously, doesnt matter.
$('.Daytime').each(function () {
$(this).prop("checked", true); // Element(s) are now enabled.
});
})
you can use the attr method of jquery to look for a specific attribute just set a value. if you want to change value of said attribute the second parameter of the function will set it for you like.
Daytime.attr("class","newClass")
$("#Daytime").attr("class")
will give you the class of #Daytime
This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 5 years ago.
I have looked around and I haven't really been able to find anything that solves my problem. There is a post using buttons but I can't seem to modify it for my needs.
I am trying to use only one event listener for multiple selects. I'd like to return the id of the select, and the value selected but as far as I can figure I either need to use document.getElementById("ID").addEventListener('change',func(),true) for each id or document.getElementsByTagName('select').addEventListener('change', func(), true) and I get an error that says:
selection.addEventListener is not a function. (In 'selection.addEventListener('change', func(), true)', 'selection.addEventListener' is undefined)
I was hoping someone could take a moment and show me where I am going wrong or if I need to use a different method to accomplish my task.
thanks for the help
The method getElementsByTagName returns HTMLCollection of elements, and not a DOM Element, so you can't use addEventListener on that.
What you can do is go over all the elements in the HTMLCollection and add the event you want to them:
let selectElements = document.getElementsByTagName('select');
Array.prototype.forEach.call(selectElements, function(el) {
eladdEventListener('change', func(), true)
})
This question already has an answer here:
How do you assign an event handler to multiple elements in JavaScript?
(1 answer)
Closed 7 years ago.
I am trying to run a function when user clicks on a class.
Here is a fiddle with a similar setup. Except that I am not using buttons in the my code.
FIDDLE
document.querySelectorAll('.menu').onclick = function () { alert("test"); };
I've also tried using the getElementsByClassName, with the same results. Is there something I am missing here?
*Note: I need to accomplish this without jQuery
querySelectorAll returns a list of elements, so you need to specify the one you want, in your case [0]:
document.querySelectorAll('.menu')[0].onclick = function () {
alert("test");
};
jsFiddle example