#Hello World Characters of Code Comparison
##JavaScript
Characters: 700
Lines of JavaScript: 13
<!DOCTYPE html>
<html>
<body>
<h1>Hello World with pure JavaScript</h1>
Write some text in textbox:
<input id="hello-input" type="text" />
<h2 id="hello-output">Hello </h2>
<script>
var inputField = document.getElementById('hello-input');
var label = document.getElementById('hello-output');
var handleKeyup = function() {
var value = inputField.value;
label.innerHTML = 'Hello ' + value;
}
if (document.addEventListener) {
document.addEventListener('keyup', handleKeyup);
} else if (document.attachEvent) {
document.attachEvent('keyup', handleKeyup);
}
</script>
</body>
</html>##jQuery
Characters: 529
Lines of JavaScript: 7
<!DOCTYPE html>
<html>
<body>
<h1>Hello World with jQuery</h1>
Write some text in textbox:
<input id="hello-input" type="text" />
<h2 id="hello-output">Hello </h2>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script>
var inputField = $('#hello-input');
var label = $('#hello-output');
inputField.on('keyup', function() {
var value = inputField.val();
label.html('Hello ' + value);
});
</script>
</body>
</html>##AngularJS
Characters: 325
Lines of JavaScript: 0
<!DOCTYPE html>
<html ng-app>
<body>
<h1>Hello World with AngularJS</h1>
Write some text in textbox:
<input type="text" ng-model="sometext" />
<h2>Hello {{sometext}}</h2>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</body>
</html>