Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
I have been watching a tutorial about how to make a to do list and so far my code is IDENTICAL to the one in the tutorial but still doesn't work-Ive been starring at the code for forever but can't figure out why..
my html (I don't have to include etc because I was writing my code on codepen(javascript,html and css are already being combined):
<body>
<h1>To Do List</h1>
<p><button id="add">Add</button></p>
<ul id="todoList"></ul>
</body>
Javascript:
function addNewItem(){
var listItem = document.createElement ("li");
listItem.innerText = "hello";
var list = ducument.getElementById("todoList");
list.appendChild(listItem);
}
var btnNew = document.getElementById("add");
btnNew.onclick = addNewItem;
In the tutorial the same code works and when you click the add button "hello" is being displayed and in my code nothing happens when i click on the add button..
You have a typo on this line:
var list = ducument.getElementById("todoList");
It's document, not ducument.
See this working fiddle: https://jsfiddle.net/omgtoblerone/h2sL1vu8/
In most browsers, if you hit F12, you'll see an error console. If you had looked at the console, you would've seen the following error:
Uncaught ReferenceError: ducument is not defined
Easy fix!
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 2 years ago.
Improve this question
I am trying to access the below tag class="topbar"
<div id="swagger-ui">
<section data-reactroot="" class="swagger-ui swagger-container">
<div class="topbar">
<div class="wrapper">
<div class="topbar-wrapper">
I have tried this:
var x=document.getElementById("swagger-ui");
var y=x.getElementByClassName("swagger-ui swagger-container");
var z=y.getElementByClassName("topbar");
Also,
How can I set value in js? I have to set the value for input type text
<div class="wrapper"><label>Value:</label><section class=""><input type="text"></section></div>
You can do something like the following:
var topbar = document.getElementsByClassName('topbar');
or
var topbar = document.querySelector('.topbar');
try to use querySelector
var x=document.querySelector("#swagger-ui");
var c=document.querySelector(".swagger-ui");
var y=document.querySelector(".swagger-container");
You're code is almost perfect, but you need to spell getElementByClassName correctly, and add an indexer for getElementsByClassName. Try adding [0] after each getElementsByClassName function. Like this: getElementsByClassName[0]
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 2 years ago.
Improve this question
https://jsfiddle.net/alachgar/upezxLas/3/
Hello All,
My Javascript that was working fine earlier now is Broken.. it worked for me just yesterday.. now it is the HOUSING Section Part works fine...
However Starting the Second Section in Light Blue it's Broken... I am not sure what I am missing..!
Please help. Thanks a alot.
Ed-
<script>
function showRent (rent_box)
{
var rent_chboxs =
document.querySelectorAll('[name="rent_eval1"],
[name="rent_eval2"],
[name="rent_eval3"],[name="rent_eval4"],[name="rent_eval5"],
[name="own_concerns"],
[name="address_different"]');
var vis = "none";
for(var i=0;i<rent_chboxs.length;i++) {
if(rent_chboxs[i].checked){
vis = "block";
break;
}
}
document.getElementById(rent_box).style.display = vis;
}
</script>
You just need to change the onclick Event name from showOwn to showRent in from line 78 to line 90 in your HTMl file
'showOwn' is not defined.
Or change it to showRent may work.
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 8 years ago.
Improve this question
var a = document.getElementById('abc');
alert(a.id) // it works.
var b = document.getElementsByClassName('qwe');
alert(b[0].id); // this is not working. returns only empty space : ''
I don't know why this happening.
a is object, and b is array object. and b[0] is object property. and also object.
Is there any one who can explain this happening's reason and solution clearly?
ps. sorry for miss 'document'. I missed it when I write this question. but in the source code, I didn't miss it.
<html>
<div id="abc" class="qwe"></div>
<div id="a1" class="qwe"></div>
<div id="a2" class="qwe"></div>
<div id="a3" class="qwe"></div>
if you write document before getElementById it should work fine .
Here is jsBin example JSBIN
var a = document.getElementById('abc');
alert(a.id) // it works.
var b = document.getElementsByClassName('qwe');
alert(b[0].id); // this is not working. returns only empty space : ''
JSFiddle
You forget to use document before getElementById and getElementsByClassName, other wise its working fine. check out above jsfidlle link
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 8 years ago.
Improve this question
I have seen numerous other posts here at SO and across the web, but those deal with trying to add the event handler before the element is created. My situation is different.
I have an html document that has the following segment:
<nav id="main_menu">
<ul>
<li id="liMapFilter" class="list"><img id="imgFilter" src="images/filter_icon.png">Filter</li>
<li id="liDiagnostics" class="list"><img id="imgTools" src="images/tools_icon.png">Administration</li>
</ul>
</nav>
I set after page is loaded, a number of event handlers by calling:
$(document).ready(function() {
home.init();
});
within the home.init() function I set the following listener:
var elmMapFilter = document.getElementById('liMapFilter"');
cs_core.addEvent(elmMapFilter, 'click', home.showDialogMapFilter, false);
All the other listener handlers wire up just fine, but this particular one always throws a null reference. I cannot understand when this handler works just fine:
var elmDiagnostics = document.getElementById('liDiagnostics');
cs_core.addEvent(elmDiagnostics, 'click', core.showDiagnostics, false);
Please advise.
You've got a typographic error. There's a stray " character in your id.
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 9 years ago.
Improve this question
I can't figure out why the jQuery functions will not work with the html here
JS Fiddle: http://jsfiddle.net/JonaTheApprentice/E89rg/
function addItem() {
$('#list').append('<li><input type="checkbox" /> item</li>');
}
function removeItem() {
$('#list').children().filter(function () {
return this.firstChild.checked;
}).remove();
}
I don't see an element with id="list", that's what #list refers to.
I think you mean #items-listed. Changing that, and it works
I would get the value from the input id. I would also assign a click event for cleaner coding. Here is an example of your fiddle adding an item. Removing an item is just the reversal.
DEMO http://jsfiddle.net/E89rg/5/
$('#Enter').click(function(){
var Val = $('#item').val();
$('#items-listed').append('<li><input type="checkbox" />'+Val+'</li>');
});