0

I'm learning javascript and have created some HTML within my javascript file so as to test a simple function that takes in nodes as parameters. I keep getting a 'document not defined' error. What do I need to do within my JS file/code to define the document?

I already tried things listed here: ReferenceError: document is not defined (in plain JavaScript)

   var div1 = document.createElement("div");
var text1 = document.createTextNode('<div id="one">Some<span>node <em>contents</em> for</span>comparison</div>');
div1.appendChild(text1);
document.body.appendChild(div1);

var div2 = document.createElement("div");
var text2 = document.createTextNode('<div id="two">Some<span>node contents for</span>comparison</div>');
div2.appendChild(text2);
document.body.appendChild(div2);


var div3 = document.createElement("div");
var text3 = document.createTextNode('<div id="one">Some<span>node <strong>contents</strong> for</span>comparison</div>');
div3.appendChild(text3);
document.body.appendChild(div3);

var div4 = document.createElement("div");
var text4 = document.createTextNode('<div id="four">Some<span>node <em>contents</em> for</span>comparison</div>');
div4.appendChild(text4);
document.body.appendChild(div4);



function nodeEquivalence(node1, node2) {
    var equal = false;
    if (node1.innerHTML === node2.innerHTML) {
        if (node1.tagName === node2.tagName) {
            if (node1.type === node2.type) {
                equal = true;
            }
        }
    }
    return equal;
}

console.log(nodeEquivalence(div1, div4));
Community
  • 1
  • 1
devdropper87
  • 4,025
  • 11
  • 44
  • 70

1 Answers1

1

Don't use innerHTML. Use createTextNode or textContent.

Create HTML element the right way:

var div = document.createElement("div");
var text = document.createTextNode("some text");
div.appendChild(text);
document.body.appendChild(div);

Your function is too complicated to compare to HTML nodes. This function

function nodeEquivalence(node1, node2) {
    var equal = false;
    if (node1.innerHTML === node2.innerHTML) {
        if (node1.tagName === node2.tagName) {
            if (node1.type === node2.type) {
                equal = true;
            }
        }
    }
    return equal;
}

is much easier.