Make sure the script is placed in the bottom of the BODY element of the document you’re trying to manipulate, not in the HEAD element or placed before any of the elements you want to “get”. It does not matter if you import the script or if it’s inline, the important thing is the placing. … Read more
You need to have your function in the componentDidMount lifecycle since this is the function that is called when the DOM has loaded. Make use of refs to access the DOM element <input type=”submit” className=”nameInput” id=”name” value=”cp-dev1″ onClick={this.writeData} ref = “cpDev1″/> componentDidMount: function(){ var name = React.findDOMNode(this.refs.cpDev1).value; this.someOtherFunction(name); } See this answer for more info … Read more
At the point you are calling your function, the rest of the page has not rendered and so the element is not in existence at that point. Try calling your function on window.onload maybe. Something like this: <html> <head> <title></title> <script type=”text/javascript”> window.onload = function(){ var refButton = document.getElementById(“btnButton”); refButton.onclick = function() { alert(‘I am … Read more
document.getElementById() only supports one name at a time and only returns a single node not an array of nodes. You have several different options: You could implement your own function that takes multiple ids and returns multiple elements. You could use document.querySelectorAll() that allows you to specify multiple ids in a CSS selector string . … Read more
You can use the script tag like this: <script defer> // your JavaScript code goes here </script> The JavaScript will apply to all elements after everything is loaded.
.remove() should remove all of them. I think the problem is that you’re using an ID. There’s only supposed to be one HTML element with a particular ID on the page, so jQuery is optimizing and not searching for them all. Use a class instead.
Assuming that structure is static you can do this: var mainDiv = document.getElementById(‘mainDiv’), childDiv = mainDiv.getElementsByTagName(‘div’)[0], requiredDiv = childDiv.getElementsByTagName(‘div’)[1]; Further reading: .getElementsByTagName() (from MDN).
document.all is a proprietary Microsoft extension to the W3C standard. getElementById() is standard – use that. However, consider if using a js library like jQuery would come in handy. For example, $(“#id”) is the jQuery equivalent for getElementById(). Plus, you can use more than just CSS3 selectors.
It is not good to use custom attributes in the HTML. If any, you should use HTML5’s data attributes. Nevertheless you can write your own function that traverses the tree, but that will be quite slow compared to getElementById because you cannot make use of any index: function getElementByAttribute(attr, value, root) { root = root … Read more
It’s document.getElementById() and not document.getElementByID(). Check the casing for Id.