This question already has answers here:
How can I get query string values in JavaScript?
(73 answers)
Closed 8 years ago.
<a class="test" href="www.abc.com?test1=1|6&test2=2">img</a>
<a class="test" href="www.abc.com?test2=1&test3=2">img</a>
<a class="test" href="www.abc.com?test3=1&test4=2">img</a>
I have a set of anchor elements with same class name, I need to extract a particular parameter, like test1 or test4, this value can be dynamic and update the href param with a new value
how do i do it in jquery?
any ideas?
function getUrlParameter(sParam)
{
$('.test').each( function() {
var href= $(this).attr('href');
//if href contain sParam ....... you should know that :)
);
});
}
String test1Param = getUrlParameter("test1");
Hope this help :)
Related
This question already has answers here:
Getting HTML elements by their attribute names
(8 answers)
Closed 3 years ago.
I have html page with elements:
<div id="location-id" class="form-control">
<span class="hub-trigger" data-hub-recordid="28">Germany</span>
</div>
I use var element= document.getElementById('location-id') to get html element.
Please tell me how can i get 28 from the span ?
I have tried to use var id = element.getElementByTagName('data-hub-recordid') with val(), text(), innerText() at the end but it didn't work as i expected.
Try it
document.querySelector('.hub-trigger').getAttribute('data-hub-recordid')
or it
const parent = document.querySelector('#location-id');
const child = parent.querySelector('.hub-trigger');
const recordid = child.getAttribute('data-hub-recordid');
This question already has answers here:
Check if a div does NOT exist with javascript
(9 answers)
Closed 4 years ago.
I have this html code,
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton" id="shipment-filter">
<a class="dropdown-item" href="javascript:void(0)" data-table="ShipmentsDataTable" id="exportShipmentCSV_all"> CSV - All Shipments </a>
</div>
And based on that, I want to add an anchor element before #exportShipmentCSV_all.
Here's what I did.
let newElementA = document.createElement('a');
newElementA.setAttribute('id', 'classfilterBtnIsClicked');
newElementA.dataset.classfilterBtnIsClicked = true;
let currentDiv = document.getElementById('shipment-filter');
currentDiv.insertBefore(newElementA, currentDiv.childNodes[0]);
After doing that,
If the #exportShipmentCSV_all has been clicked, I'd like to check if the element exists using this way
if (document.getElementById('classfilterBtnIsClicked').length) {
// Code here
}
which is based on this reference.
Is there an "exists" function for jQuery?
But doing so, I got this error in chrome dev tool console.tab
Uncaught TypeError: Cannot read property 'length' of null
Within this code, there are also jquery in it,
Can you suggest the way I should check, if element has been created or not?
Document.getElementById() - Return value
An Element object describing the DOM element object matching the specified ID, or null if no matching element was found in the document.
The returned element object does not have length property, thus you get undefined.
Why use length? You do not need to use length property here, checking the element object itself is enough:
let newElementA = document.createElement('a');
newElementA.setAttribute('id', 'classfilterBtnIsClicked');
newElementA.dataset.classfilterBtnIsClicked = true;
let currentDiv = document.getElementById('shipment-filter');
currentDiv.insertBefore(newElementA, currentDiv.childNodes[0]);
if (document.getElementById('classfilterBtnIsClicked')) {
console.log('Element exists');
}
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton" id="shipment-filter">
<a class="dropdown-item" href="javascript:void(0)" data-table="ShipmentsDataTable" id="exportShipmentCSV_all"> CSV - All Shipments </a>
</div>
This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 6 years ago.
I am having problems calling multiple elements with the same class name when using .innerhtml. For instance the url I am working with is:
https://www.amazon.com/s/ref=nb_sb_noss_2?url=search-alias%3Daps&field-keywords=hen
and when I enter the following code in chrome console I get:
document.getElementsByClassName('a-size-small a-color-secondary')
<span class="a-size-small a-color-secondary">by </span>
<span class="a-size-small a-color-secondary">Adore Plush Company</span>
<span class="a-size-small a-color-secondary">Get it by <span class="a-color-success a-text-bold">Tuesday, Jun 21</span></span>
...
...
But when I enter: document.getElementsByClassName('a-size-small a-color-secondary').innerHTML
I get "undefined". The goal is to get just the text between the span tags.
Can someone give me some guidance? I have tried with different variations including var and even Selection method. It worked with Selection for the first class element but didn't work at all with SelectionAll. Thanks for any help.
document.getElementsByClassName('a') will give the Object with class name .
for example class name is a and there are many spans with a , then you need get the span value by using index of that object
var x =document.getElementsByClassName('a');
console.log("value of spans"+x[0].innerHTML);
COdepen-http://codepen.io/pen/
This question already has answers here:
jQuery if div contains this text, replace that part of the text
(5 answers)
Closed 8 years ago.
...
<div>
<div>
{FirstName} {POSITION}
</div>
</div>
...
We would like find element {FirstName} and repalce him on test.
For this we make:
$("{FirstName}").replaceWith("test");
But it is not working...
Tell me please how right make replace?
What you should do is target the parent DIV (lets pretend it has a class of .test)
var content = $('.test').html();
var new_content = content.replace('{Whatever}', 'Hello');
$('.test').html(new_content);
Or in short (I haven't tested this, but it should work)
$('.test').html($('.test').html().replace('{Whatever}', 'Hello'));
If you just want to replace a string in DOM elements, the question has been asked before :
Replace all strings in dom element
But best to do this would be to use a template engine.
This question already has answers here:
How do I replace all occurrences of a string in JavaScript?
(78 answers)
Closed 9 years ago.
Markup:
<div class="post">
[tag]dfghf[/tag][tag]gh[/tag][tag]cxbcvb[/tag][tag]gh[/tag][tag]cxbcvb[/tag][tag]gh[/tag]
</div>
JS I have so far-
for(var j=0;j<post.length;j++){
var postText = $(post[j]);
postText.html(postText.html()
.replace('[tag]','<span class="tag">')
.replace('[/tag]','</span>')
);
}
Though this seems to only replace the very first tag. How do I get it to replace all the tags?
Try
postText.html(postText
.html()
.replace(/\[tag\]/g,'<span class="tag">')
.replace(/\[\/tag\]/g,'</span>')
);
Ex:
$('.post').html(function(){
return $(this)
.html()
.replace(/\[tag\]/g,'<span class="tag">')
.replace(/\[\/tag\]/g,'</span>')
})
Demo: Fiddle