single .js file to execute on multiple html pages

Question

I created a .js file for the directory of html of files I am working with. The purpose of the .js file is to remove element ids. So in my .js file I currently have the script

var element=document.getElementById("id1");
element.parentElement.removeChild(element);

which works perfectly fine and does what I need to do. Now If I was to include an additional script to remove the id element of a different html page

var element = document.getElementById("id1");
element.parentElement.removeChild(element); 

var elem = document.getElementById("id2");
elem.parentElement.removeChild(elem);

Only the first script is executed and the second is not in addition I receive the message "Uncaught type error: cannot read 'parentElement' of null. I would think that each html page would read the .js file and match the corresponding element it is referring too and make the change.

http://stackoverflow.com/q/14028959/669576 – 001 Nov 08 '16 at 21:15 — 001, Nov 08 '16 at 21:15
What do you mean by "a different html page"? – guest271314 Nov 08 '16 at 21:40 — guest271314, Nov 08 '16 at 21:40
A.html and B.html an example of a different html page – NickJ Nov 09 '16 at 12:55 — NickJ, Nov 09 '16 at 12:55

score 0 · Accepted Answer · answered Nov 08 '16 at 21:20

Uncaught type error: cannot read 'parentElement' of null means that it could not find the element with the given id and therefore you can not try to find its parent element. If you wanted to make this more generic you could try abstracting it to a function

function removeElementById(elId) {
    var el = document.getElementById(elId);
    if (el) {
        el.parentNode.removeChild(el);
    }
}

Now whenever you try to remove an element it will first check that it is not "falsy" before attempting to remove the element from its parent.

score 0 · Answer 2 · answered Nov 08 '16 at 21:22

It's like the error says, the parentElement of a non existing element is null, and null has no method 'removeChild' So you must check if element exists.

var element=document.getElementById("id1");
if(element) {
    element.parentElement.removeChild(element);
}

score 0 · Answer 3 · answered Nov 08 '16 at 21:22

0

The element (id2) you tried to find is probably not in DOM when the srcipt runs. You will need to check if it is null before accessing its methods.

answered Nov 08 '16 at 21:22

Dragonmon

114
6

single .js file to execute on multiple html pages

3 Answers3