JavaScript for WordPress Forums Vanilla JavaScript 1.3.05 Missing how to play with these in the console Reply To: 1.3.05 Missing how to play with these in the console


Hi Jose – thanks for that screenshot! Yes, I can get the results with the document. type of commands, but I want to replicate the exercises that Zac created for his lessons on Getting and Setting, for example. What I want to do is take a new website (not the html file that Zac used, but a random one off the web), and explore it similar to how Zac did it with his html file. Here’s an example from Zac’s exercises:

* Setting outerHTML and outerText

// var content = document.querySelector( ‘.content’ ),
// newOuterHTML;

// content.outerHTML = ‘<div class=”content active”>’;
// content.outerHTML += ‘<h1>New Title</h1>’;
// content.outerHTML += ‘<p>Nuevo Lorem</p>’;
// content.outerHTML += ‘</div>’;

// newOuterHTML = ‘<article class=”content active”>’;
// newOuterHTML += ‘<h1>New Title</h1>’;
// newOuterHTML += ‘<p>Nuevo Lorem</p>’;
// newOuterHTML += ‘</article>’;
// content.outerHTML = newOuterHTML;

// content.outerText = ‘All of the new text’;
// console.log( content );

When I put these in, I get errors.
Can you help me see what I’m doing wrong with this approach? I’m sorry if Zac explained how to do this on a random website, but I must have missed it if so. I know he explained how to query the document and that works fine.

Thanks again Jose!