ivanteoh/174-homework1.html

## 174-homework1.html
<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
    <title>JavaScript 101</title>
    <script type="text/javascript">
        function load()
        {

            function forEach(array, action) {
                var i;
                for (i = 0; i < array.length; i++) {
                    action(array[i]);
                }
            }

            function escapeHTML(text) {
                var replacements = [["&", "&amp;"], ["\"", "&quot;"],
                                   ["<", "&lt;"], [">", "&gt;"]];
                forEach(replacements, function(replace) {
                    while (text.indexOf(replace[0]) != -1) {
                        text = text.replace(replace[0], replace[1]);
                    }
                });
                return text;
            }

            function isTextNode(node) {
                return node.nodeType == 3;
            }

            function map(func, array) {
                var result = [];
                forEach(array, function (element) {
                    result.push(func(element));
                });
                return result;
            }
            var first = true;
            function asHTML(node) {
                if (first) {
                    node.innerHTML = node.innerHTML.replace(
                      /\B\s\B|[\n\r\t]/g,'');
                    first = false;
                }

                if (isTextNode(node))
                    return escapeHTML(node.nodeValue);
                else if (node.childNodes.length == 0)
                    return "<" + node.nodeName + "/>";
                else
                    return "<" + node.nodeName + ">" +
                        map(asHTML, node.childNodes).join("") +
                        "</" + node.nodeName + ">";
            }

            console.log(asHTML(document.body));

        }

    </script>
</head>
<body onload="load()">
    <h1>This is a header!</h1>
    <p id="excitingText">
        This is a paragraph! <em>Excitement</em>!
    </p>
    <p>
        This is also a paragraph, but it's not nearly as exciting as the
        last one.
    </p>
</body>
</html>

## 174-homework2.html
<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
    <title>JavaScript 101</title>
    <script type="text/javascript">
        function load()
        {

            function removeElement(node) {
                parent = node.parentNode;
                if (parent) {
                    parent.removeChild(node);
                }
            }
            console.log(removeElement(document.body.childNodes[1]));

        }
    </script>
</head>
<body onload="load()">
    <h1>This is a header!</h1>
    <p id="excitingText">
        This is a paragraph! <em>Excitement</em>!
    </p>
    <p>
        This is also a paragraph, but it's not nearly as exciting as the
        last one.
    </p>
</body>
</html>

## 174-homework3.js
function registerEventHandler(node, eventType, handler) {
    if (typeof node.attachEvent === 'function') {
        node.attachEvent("on" + eventType, handler);
    } else {
        node.addEventListener(eventType, handler, false);
    }
}

## 174-homework4.html
<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
    <title>JavaScript 101</title>
    <script type="text/javascript">

    function createFieldset(id, parent){
        var element = document.createElement('fieldset');
        element.setAttribute('id', id);
        parent.appendChild(element);
        return element;
    }

    function createInput(id, parent){
        var element = document.createElement('input');
        element.setAttribute('id', id);
        element.setAttribute('type', 'text');
        parent.appendChild(element);
        return element;
    }

    function createButton(id, parent, name, funcName) {
        var element = document.createElement('input');
        element.setAttribute('id', id);
        element.setAttribute('type', 'button');
        element.setAttribute('value', name);
        element.setAttribute('onclick', funcName);
        parent.appendChild(element);
        return element;
    }

    function createSpan(id, parent, text){
        var element = document.createElement('span');
        element.setAttribute('id', id);
        var child = document.createTextNode(text);
        element.appendChild(child);
        parent.appendChild(element);
        return element;
    }

    function adding(){
        var total = parseInt(document.getElementById('total').value);
        if (total && total < 11 && total > 1) {
            var grandTotal = 0;
            for (var i = 0; i < total; i++) {
                    var number = document.getElementById('input' + i);
                    if (!number) {
                        continue;
                    }
                    var numberValue = parseInt(number.value);
                    if (numberValue) {
                        grandTotal += numberValue;
                    } else {
                        alert('"' + number.value + '" is not an integer');
                    }
            }
            var result = createFieldset('result', document.body);
            createSpan('span', result, grandTotal);
        } else {
            alert('Have you changed the total?');
        }
    }

    function submit(){
        var total = parseInt(document.getElementById('total').value);
        if (total && total < 11 && total > 1) {
            var fieldset = createFieldset('fieldsetlists', document.body);
            for (var i = 0; i < total; i++) {
                createInput('input' + i, fieldset);
            }
            createButton('addButton', fieldset, 'add', 'adding();');
        } else {
            alert('Please enter a number between 2 to 10!');
        }
    }
    </script>
</head>
<body>
<fieldset>
    <p>How many numbers do you want to add (max is 10)</p>
    <input type='text' id='total' />
    <input type='button' value='submit' onclick='submit();'/>
</fieldset>
</body>
</html>
	<!DOCTYPE HTML>
	<html lang="en">
	<head>
	<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
	<title>JavaScript 101</title>
	<script type="text/javascript">
	function load()
	{

	function forEach(array, action) {
	var i;
	for (i = 0; i < array.length; i++) {
	action(array[i]);
	}
	}

	function escapeHTML(text) {
	var replacements = [["&", "&"], ["\"", """],
	["<", "<"], [">", ">"]];
	forEach(replacements, function(replace) {
	while (text.indexOf(replace[0]) != -1) {
	text = text.replace(replace[0], replace[1]);
	}
	});
	return text;
	}

	function isTextNode(node) {
	return node.nodeType == 3;
	}

	function map(func, array) {
	var result = [];
	forEach(array, function (element) {
	result.push(func(element));
	});
	return result;
	}
	var first = true;
	function asHTML(node) {
	if (first) {
	node.innerHTML = node.innerHTML.replace(
	/\B\s\B\|[\n\r\t]/g,'');
	first = false;
	}

	if (isTextNode(node))
	return escapeHTML(node.nodeValue);
	else if (node.childNodes.length == 0)
	return "<" + node.nodeName + "/>";
	else
	return "<" + node.nodeName + ">" +
	map(asHTML, node.childNodes).join("") +
	"</" + node.nodeName + ">";
	}

	console.log(asHTML(document.body));

	}

	</script>
	</head>
	<body onload="load()">
	<h1>This is a header!</h1>
	<p id="excitingText">
	This is a paragraph! <em>Excitement</em>!
	</p>
	<p>
	This is also a paragraph, but it's not nearly as exciting as the
	last one.
	</p>
	</body>
	</html>
	function registerEventHandler(node, eventType, handler) {
	if (typeof node.attachEvent === 'function') {
	node.attachEvent("on" + eventType, handler);
	} else {
	node.addEventListener(eventType, handler, false);
	}
	}