Getting the content inside a span based on its class and id - javascript

Im trying to use -
console.log('the favorite count:', $('.favorite-count#'+id).text());
The id variable is correct but when I log it out, it's logging out blank.
This is what the html looks like -
highlighted is the value im trying to get and change in my code

The problem was I was using the same id in two separate places, so the second one I just prefixed with 'count' and now it's working okay.

Your html also looks a little malformed. Your image tag is not closed but has an unclosed < span> inside.
As for your selector try $('.favorite-count [id^=' + id + ']').text()

Related

How do I manipulate the href attribute inside of an <a> tag that I have wrapped inside of an <li> tag?

I began creating a dynamic portfolio, where an array will automatically populate an ordered list with list items. The list items will have the label as the name and the url as the link.
This has mostly worked, except the problem is that I cannot get the 'href' attribute in the tag to change. Instead of being week1/index.html, it ends up being [object Text]. You can see this in the HTML picture. When looking at the URL in my browser when viewing the HTML page, it says [object%20Text] at the end of the URL instead of week1/index.html at the end.
I have tried using setAttribute, as is shown in the code. I have also tried using newA.href = newURL. What I'm doing seems to match solutions that I have found on the internet, but it isn't working. If I remember correctly, I also tried manipulating the onclick attribute to change the link when it is clicked, but that wasn't working either. If there's a syntax issue, I am unaware of it.
I was curious if my newUrl variable had the correct information, and it does. If I do newA.appendChild(newUrl) instead of newA.appendChild(newLabel), it will correctly show that as the label of the list item. If I do newA.setAttribute("href", newLabel) instead of using newUrl, then it will show the same [object Text] inside the href attribute.
Thank you for taking the time to look at this and think about what the issue is.
The javascript code
how the HTML looks after everything:
Always paste your code here so that we can help you more easily.
you're calling
const newUrl = document.createTextNode(links[i].url);
which creates a text object
then you have newA.setAttribute("href", newUrl); which sets the href attribute to that TEXT OBJECT like it shows in your rendered html.
correct the declaration/initialization line to a string
const newUrl = links[i].url;

Javascript, how to set/call the value inside HTML output

I did not the put the full code, it's a lot
I have the a countingdown script,
Im trying to set a new string inside of this code, and then, call the same string to fill up a link inside html code.
Code
var events = [
["Example",["02:00","06:00","10:00","14:00","18:00","22:00"]],
["Example2",["03:00","05:00","8:00","11:00","15:00","19:00"]],
Im trying to apply a different image name for each row that I have, I tried something like this:
I tried this:
var events = [
["Example",["02:00","06:00","10:00","14:00","18:00","22:00"],["image.png"]],
["Example",["03:00","05:00","8:00","11:00","15:00","19:00"],["another-image.png"]],
My HTML output is like that:
<a href="#">' + line[0] + '<img src="https://mywebsite.com/images/'PRINT IMAGE.PNG HERE"></img>
I want to complete the link (example 3) with the value added (example 2)
How can I call it properly?
I cannot just fill the html with this name, cuz I need one different image for each row inside "var events".
Check this Image please, question explained.
Thank you
I think you are talking about parameters, every time you call the same funcion you want it to initiate but with different ids(show a different image), is that what you want? correct me to help you.

How do you append text to an input box using socket io inside html

I am having trouble at the moment trying to append text from inside my html.
<input id="connection" type="text">
socket.on('Connect',function(){
console.out('testing blah');
$('connection').val('con');
$('connection').append("con");
$('#connection').append('con');
});
I need a way of alerting the user that the server is available or not. I have tried all of the above examples and they all don't work correctly.
$('connection').val('con');
You missed the # prefix for the id selector
$('connection').append("con");
$('#connection').append('con');
append() is invalid for input elements, and your first example is again missing the #.
Your first example, using val(), is the right way to achieve what you need, you just need to include the # in the selector:
$('#connection').val('con');
This piece of code fixed my problem:
$('#connection').html('connected');
The reason I changed to html is because this clears the label instead of adding extra text to it.

Grab Number From Text And Add One With Jquery

Basically I am trying to just grab a number from this div, and it only contains this one number. Now once I grab it I would like to add one to it, but I can not get this to work. I am successfully grabbing the number, but when I add to it the number does not seem to work correctly.
Let me give you an example:
Div has the number 10 in it.
Jquery runs on it.
Div has the number 11 in it.
That is the expected, but instead, it changes the number to 1 after I add to it, and I do not know why.
Here is my code:
$(".postvotenumber").text(parseInt($(".postvotenumber").val()) + 1);
So this code is not adding one to the current number, but instead just making it one. How do I fix this? Thank You!
Your jquery is a bit off try this
$(".postvotenumber").text(parseInt($(".postvotenumber").text()) + 1);
divs do not have a value, so the val function doesn't return anything. The text function returns what is in the div tag.
It should be:
$(".postvotenumber").text((parseInt($(".postvotenumber").text()) + 1));
.val is used for inputs and text area's mostly. For a div you'll need to get the text via the .text, and set it with .text() also.

Javascript create element and add HTML

say for instance i have the following line:
var arrowBase = document.createElement('div')
Now within this div tag i want to add some HTML (i.e text).
Then i tried the following:
arrowBase.innerHTML('hello');
However this does nothing:S
i have also tried: arrowBase.HTML('hello');
But once again without any result
I know is that rather simple but in my search i could'nt find the answer hope someone is able to help me out here
Read the docs, it is not a method.
arrowBase.innerHTML = 'hello';
arrowBase.textContent = "HELLO"
also does the same thing but only text can be specified. Whereas in innerHTML html tags can be specified along with the text.

Categories

Resources