Last active
March 4, 2019 18:14
-
-
Save ChasManRors/90752c566bb6857a86e7c8c0fab4407c to your computer and use it in GitHub Desktop.
[Simple javascript function] A few examples of html with javascript #html #js #ex #from_tutorial
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Simple javascript function print to console example | |
<!DOCTYPE HTML> | |
<html> | |
<head> | |
<title>Practical JavaScript</title> | |
</head> | |
<body> | |
<script type="text/javascript"> | |
// Square the given number x | |
function square1(x) { | |
return (x * x) ; | |
} | |
// Square the given number x | |
const square2 = x => { return (x * x); } | |
for(var i = 0; i < 11; i++) { | |
console.log(`${i} squared is ${square2(i)}`) | |
} | |
<!-- console.log(square1(0)); // Must show 0 --> | |
<!-- console.log(square1(2)); // Must show 4 --> | |
<!-- console.log(square1(5)); // Must show 25 --> | |
<!-- console.log(square2(0)); // Must show 0 --> | |
<!-- console.log(square2(2)); // Must show 4 --> | |
<!-- console.log(square2(5)); // Must show 25 --> | |
</script> | |
</body> | |
</html> | |
// Simple javascript function adding prototype function to body example | |
<!DOCTYPE html> | |
<html> | |
<body> | |
<h2>JavaScript Objects</h2> | |
<p id="demo"></p> | |
<script> | |
function Person(first, last, age, eye) { | |
this.firstName = first; | |
this.lastName = last; | |
this.age = age; | |
this.eyeColor = eye; | |
} | |
Person.prototype.name = function() { | |
return this.firstName + " " + this.lastName | |
}; | |
var myFather = new Person("John", "Doe", 50, "blue"); | |
document.getElementById("demo").innerHTML = "My father is " + myFather.name(); | |
</script> | |
</body> | |
</html> | |
// Simple side loaded font on input element of type submit and text example | |
<html> | |
<head> | |
<style> | |
@import url('https://fonts.googleapis.com/css?family=Montserrat|Roboto'); | |
* { | |
font-family: montserrat,helvetica,arial,sans-serif; // font-family is also set in typography.scss | |
} | |
</style> | |
<head> | |
<body> | |
<div id="comments"> | |
<form name="list" action="list" accept-charset="UTF-8" method="get"><input name="utf8" type="hidden" value="✓"> | |
<div id="query"> | |
<input type="text" name="query" id="query"> | |
<input type="submit" name="commit" value="Search"> | |
</div> | |
</form> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment