<!DOCTYPE html>
<html>
<head>
<title>Intro to JavaScript</title>
</head>
<body>
<div id="container"></div>
</body>
</html>With the fast surge of mobile devices and Apple's decision to forego supporting Adobe's Flash - which had previously been the go-to technology for creating on-page interactions and animations - JavaScript became even more important because it was already native to browsers on any device.
The following methods are true whether you are using native JavaScript, a library like jQuery, plugins, etc.
You can add the following at any point in your HTML file, however, it is best to add it to the bottom of the page, before your closing </body> tag
<script type="text/javascript">Your Script Here</script>
Almost the same as adding internal script, except you add a source attribute to the <script> tag, and nothing in between
<script type="text/javascript" src="js/main.js"></script>
Variables are symbolic names for values in your code
var. For example var x = 1025; or var x = "Hello, World!";x = 1025. This method creates a global variable and should be used sparingly.Javascript recognizes the following value types:
null: A special keyword assigned as a representation of no valueundefined: A variable that has been declared but has not been assigned a valueDOM = Document Object Model
In the DOM, everything is a node - HTML elements are element nodes and attributes are attribute nodes and text inside of elements are text nodes.
When we refer to the DOM, which we do a lot in JavaScript, we are simply referring to the layout of nodes that make up a page.
To use methods, JavaScript uses document to refer to your HTML. By calling document, we can access the entire DOM (all the nodes!) on the page.
In JavaScript, this is the way by which we can access various properties, including methods, of an object. Start with the top level object and use dots to "drill down".
For example, there are a number of methods we can use to access or set properties of our document.
The syntax is document.yourproperty or document.yourmethod()
You can use a log statement to check the value of any variable in your brower's console.
console.log(var);
We use variables to "store" information. Whenever we create an HTML or text node, we then have to store it and create a reference to it using a variable, which we can then add to the page at a point of our choosing. Create references to the following:
To refer to specific nodes on the page that we want to change, we can create a reference to them using methods like:
Functions in JavaScript combine a series of events or actions into one step. This is useful when there is a series of actions you want to perform more than once. REMEMBER:
var myFunc = function(param){
console.log("RUN MY FUNCTION");
}
note: All lines of JavaScript should end with a semi-colon.
Can be passed to your function so that the events within the function can be run on different objects. The parameter is a placeholder name for whatever value we pass to it.
Just putting a function in your code will not automatically run that function. To call the function, type the name of the function with a set of parathenses after it (which is where you will pass your parameter if you have one): myFunc(param);
In other programming languages there are classes, which can be repeated. We can simulate this in JS using named functions:
function addItem(param){
console.log("ADD AN ITEM");
}
And then to run, call the name of the function: addItem(param);
Write a function on your homepage that triggers an alert when the user loads the page. HINTS: