This question already has answers here:
jQuery : select all element with custom attribute [duplicate]
(2 answers)
Closed 6 years ago.
Is there a way to grab a whole element by one of its data attributes via javascript or jQuery? Say i have a link somewhere on a website like this
Google
Since the link above doesn't have any id or class i cannot grab it by that. I need to get it by its data-source attribute. So say i could somehow with jQuery get the value of a attribute with the name of data-source. How would i do that ?
$('[data-source="google"]')
This will select all elements which data-source attribute equals to google.
See Attribute Equals Selector [name=”value”].
Related
This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 7 days ago.
I'm trying to get an element which is added by an external application. The only way I can get this specific element is by the data-i18n-key attribute which I thought I can grab like any data attribute so something like this.
The code:
const buttons = document.querySelectorAll('[data-i18n-key="sdk.seamless_product_reward.paid_items_required"]');
console.log(buttons.length);
<span class="lion-reward-item__redeem-button-text lion-loyalty-page-reward-item__redeem-button-text" data-i18n-key="sdk.seamless_product_reward.paid_items_required">Paid items required</span>
However, this doesn't return anything. Any ideas how to do this?
Of course, Barmer is absolutely right. Your code works. The problem will be that your JS is initialised before the DOM has finished loading. Pack your JS above the closing body tag.
This question already has answers here:
Can I use an attribute selector for CONTAINS in queryselector()?
(2 answers)
CSS attribute selector class starts with but not equals to
(2 answers)
Closed 3 years ago.
Trying to get matches of attributes with wildcards to find out how many elements of a type are on the page
I think I should be able to use queryselectorAll on a partial attribute value as shown below, but no elements found :(
<div class="ag-right-align-cell" data-test="unitPrice&^%^&category=FRED&^%^&displayName=FREDS INFO;field=unitPrice&^%^&^%^&">$999.99</div>
<div class="ag-right-align-cell" data-test="unitPrice&^%^&category=GEORGE&^%^&displayName=GEORGES INFO;field=unitPrice&^%^&^%^&">$999.99</div>
var el=document.querySelectorAll('[data-test|=unitprice]');
console.log(el.length); // = 0
el.length shows 0 elements found.
What is the correct javascript for a match for selecting datatest=unitprice* ?
This question already has answers here:
Filter divs by data-attr containing string
(4 answers)
Closed 6 years ago.
I'm filtering images based on data attributes, and for each filter data attribute there can be several tag values. To match an element based on one data attribute value, you can do this:
$('.image-container').filter('[data-places="Canada"]').css('display','none');
But when I try this with a space delimited list, it doesn't work:
<div class="image-container" data-places="Nunavut Canada">...</div>
Is there any way in jquery to select by a value in a set in a data attribute?
The other option I can think of is to loop through an array of selected elements, but I've got images loading in via ajax in an infinite scroll so this array would be very bulky at some point. I'm open to non-jquery solutions as well.
You have to use attribute contains a word selector at this context,
$('.image-container').filter('[data-places~="Canada"]').css('display','none');
Attribute equals selector cannot be used here since you are searching for a particular word in the attribute. Also you can use attribute contains selector, but that would select element with attribute like data-places="NunavutCanada"> also.
This question already has answers here:
jquery get only all html elements with ids
(3 answers)
Closed 8 years ago.
Simple. I want to traverse the DOM and find all elements that have an id attribute. Can someone help me with a js and/or jquery script
You can query all the elements with an id attribute by using the following jQuery selector:
$("[id]")
You can also just use plain JavaScript using querySelectorAll:
document.querySelectorAll("[id]")
If you want to find non-empty id attributes, use this selector instead:
'[id]:not([id]="")'
Simple attribute selector
$('[id]');
Reference : Has Attribute Selector [name]
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
How to get the attributes of a HTML element using JQuery?
I have a piece of JS and I need to read property 'value' from a div.
I do this:
$('#calendar_event_path')
I get this as and answer:
[<div id="calendar_event_path" value="company_events_index"></div>]
How can I get "company_events_index" value from the div?
use data-value attribute in your html
<div id="calendar_event_path" data-value="company_events_index"></div>
the in jQuery fetch its value using data()
var sumthng = $('#calendar_event_path').data("value");