Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I have added a new element dynamically through jQuery like this:
var elem = $('#unique').append($('<span>').attr('data-rollNo', i));
Now I need to use this element after this to add something to it. Is there a way I can store a reference to this element here, so I done need to search the entire DOM every time I edit this?
Use appendTo method instead of append:
var $span = $('<span>').attr('data-rollNo', i).appendTo('#unique');
Now, span is appended and you also have a reference to this new object.
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 4 years ago.
Improve this question
I am trying to find the appropriate way to edit an element but it seems like their is only one node with an ID. I have thought of
my code looks like:
var root=document.getElementById("app-mount").childNodes;;
var child = root[n].innerHTML;
But this is not reusable to get the path to any element such as $0 used in chrome dev tools. I was wondering if there was a method one could call on $0 to just give me the path so one could know how to target it as one does for an ID document.getElementById('id');
Edit:
after getting help I have updated my code to look like:
document.querySelectorAll('svg')[1].outerHTML="<img id='orb' class='orb' src='https://i.imgur.com/k3d8qMN.gif' width='50' height='60'>"
Its for a theme I am making for discord!
Thanks for the help!
I am not sure that I am following your question very well, but if I understand you correctly, you are looking for something like querySelector or querySelectorAll.
You can use CSS commands to target various HTML elements. eg:
document.querySelector('div'); //returns the first div
document.body.querySelectorAll('div'); //returns all the divs attached to the body element
You can also target ids:
document.querySelector('#app-mount');
or classes:
document.querySelector('.blue');
and query selectors may also be used:
document.querySelector('#app-mount > ul > li:nth-child(3)');
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
I have button with id = btnadd And java script file “myscript” which is referenced in layout page.
I want this function to fire on button click but this doesn’t happen. Could anybody tell me what is the error here?
View script like this:
myscript java script file like this:
Use this code instead:
$(document).on("click", "#btnaddd", function() {
alert("click");
});
If it still does not work then you might have used the same ID btnadd for two different elements and JQUERY only matches the first one.
Maybe multiple elementes with de same id, you can see this code at jsfiddle.
$(document).ready(function() {
$('#mybt').click(function(){
alert('s')
})
});
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
Hello there am trying to make an image gallery for example lets say that I have multiple images and I want to change their opacity when I hover over them by using JavaScript I know that this is possible with CSS but am trying to accomplish this with JavaScript I tried using get Elements By Tag Name method but the problem it just can access one element by time so can I do that thanks
Try this:
var elements = document.getElementsByTagName("img");
Array.prototype.forEach.call(elements, function (e) {
// Here you can access each image individually as 'e'.
});
When you hover, get the ID of that image. Then loop through all images (example above) and set their opacity. If the element is equal to the one you clicked on (remember, you just took the ID so you can use it), just skip to the next one using continue;.
you have to collect you image elements like
var images = document.getElementsByTagName("img");
then you have to do like
Array.prototype.forEach.call(images, e => e.addEventListener("mouseover", function( event ) { do something}));
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I need to get the element by class of "balls" from the div gameContent.
Basically grabbing the lottery numbers from Play4 from this site:
http://www.flalottery.com/play4.do
How can I get the element by class from another class? If I just do balls, all of the numbers show up, which aren't relevant and would mess up data.
Do you mean something like this:
document.getElementsByClassName('gameContent')[0].getElementsByClassName('balls')
Get elements by class "gameContent" followed by "balls". Query assumes that the first gameContent is what we are interested in.
Hope this helps.
you can use the following query selector
var elems = document.querySelectorAll(".gameContent .balls")
That is pure JavaScript. You can of course use the same query selector for jQuery
For instance with jQuery this would be
var elems = $(".gameContent .balls")
Notice how the query selector is identical.
Did you try
$(".gameContent .balls")
Judgeing by the page you've included in your question, you'll probably want to iterate through the <span> elements to get each ball number:
$('.gameContent .balls').each(function(){
alert('next ball: '+$(this).html())
});
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I want so save states of containers in any tags of them to use it with jQuery. The problem is JS says undefined if I use data-xy and data() or attr().
What is the best way to achieve this?
Had this a lot of times. the data attribute will be lowercase, always.
Say:
<div id="hello" data-testHello="HelloThere">Test</div>
The data will still be accessed by:
$('#hello').data("testhello"); rather than "testHello".
Hope this helps.
Create an object with property as the id of div or element, and the value.
<div id="foo"><span>this is a test</span></div>
For set the state
var stateStore = {};
stateStore["foo"] = "dirty";
For access to the state
$("div").each(function(){
MakeAnythingWithIt(this);
})
function MakeAnythingWithIt(theElement)
{
var elementState = stateSore[$(theElement).attr("id")];
}
Another way is append an input type="hidden" with the state information