Skip to content

Instantly share code, notes, and snippets.

@JordanMajd

JordanMajd/index.html

Last active May 11, 2016 18:42
Show Gist options
  • Save JordanMajd/ab6cf05df868f4fcfa1cb0f28f1b71e3 to your computer and use it in GitHub Desktop.
Save JordanMajd/ab6cf05df868f4fcfa1cb0f28f1b71e3 to your computer and use it in GitHub Desktop.
Download ZIP
Where Is Waldo?
Raw
index.html
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Where is Waldo?</title>
<style>
#wenda {
display: none;
}
</style>
</head>
<body>
<div class="container" style="background-color: #FFF">
<h1>Where is Waldo?</h1>
<div class="row">
<h3>Instructions</h3>
<p>In the script tag below update the function findWaldo to:</p>
<ul class="d">
<li>
Search the document for an element that contains the text, 'Waldo'
</li>
<li>
<span>When </span><span>it </span><span>finds </span><span><span>the </span><span>tag </span></span>add a style to make it visible.
</li>
<li>
Finally, return the element ID.
</li>
<li>
<span>You cannot use jquery, getElement* or querySelector* methods</span>
</li>
<li>
Instead <span>you </span><span>have to use <span>the following methods: </span></span>
<ul>
<li>
childNodes
</li>
<li>
firstChild
</li>
<li>
lastChild
</li>
<li>
parentNode
</li>
<li>
nextSibling
</li>
<li>
previousSibling
</li>
</ul>
</li>
</ul>
</div>
<div class="row">
<h3>What is the Catch?</h3>
<div class="row">
<p>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</p>
<p>
lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud <span>exercitation</span> ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>
<p>
This HTML is littered with lots of <span>junk tags </span><span><span></span></span>
</p>
</div>
</div>
</div>
<script>
/* do not modify this code */
(function(_w, __w, ___w, ____w, _____w, ______w, _______w) {'use strict';var w = _______w[_____w](____w);w.innerHTML = _w;w.id = __w;_______w[______w](___w).appendChild(w);}('Waldo', 'wenda', '.d', 'p', 'createElement', 'querySelector', document));
</script>
<script>
/* TODO modify this code */
'use strict';
function findWaldo() {
var rootNode = document;
return null;
}
console.log(findWaldo());
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment