Ben 10 Fan Fiction Wiki
Register
Advertisement
Ben 10 Fan Fiction Wiki

After conducting some better research about JavaScript and practicing more, I decided to make this new tutorial because frankly my old JavaScript tutorial was not very good, nor was some of it correct. Again, JavaScript is a scripting language and the most used scripting language on the internet today. I still have not found a way to make JavaScript directly compatible in Wikia's main namespace, so to make this easy I'm only going to be using Notepad++ for this tutorial.

What You Will Need[]

  • Knowledge of HTML and CSS. Visit my old blogs to learn more!
  • Notepad++, free download from http://notepad-plus-plus.org/
  • (optional) A wiki that you, meaning that you are either the founder or one of the main admins

JavaScript vs. Java[]

JavaScript and Java are two completely different languages. I'm not going to get into the differences much partly because I'm not experienced with Java; however, Java is older and was created by Sun Microsystems while JavaScript is somewhat based off of Java and was created by Netscape Communications Corporation and the Mozilla Foundation.

Basic JavaScript[]

Before you can begin coding out a full website using JavaScript, you must first know basic information. In the rest of this blog I will talk about documents and variables.

A document is anything where a language is written onto. Several different lines of JavaScript reference the document, as well a certain element's ID. For example, in the example below, the function, which you will learn about later, changes the text (the inner HTML) of the element with the ID 'example.'

Note: Before you begin using Notepad++, change the language to HTML. To get the code to render a webpage, save as a .html in the dropdown of possible file types. Then, go to where you saved it and open it.

JSBasics1

Produces:

JSBasics2

and when that is clicked, the text changes to:

JSBasics3

You will learn more about functions in the second part of this tutorial.

Variables[]

A variable in JavaScript is anything that stores something else. The two main variables I will be talking about in this blog are numbers and strings.

A number is any variable that is a number. To define any variable, you must first put the word var, then the name of the variable. This must be followed by = and then the value stored in the variable. Variables can be used as shortcuts, but they can also be used to do math. If the variables defined are var nbm1 = 7 and var nmb2 = 8, then document.write(nmb1 + nmbr2) will render 15:

Note: '<br />' adds a break after the line of text.

JSBasics4

produces:

JSBasics5

Strings[]

There are two ways to create a string. One way is to place the data stored in the variable in quotes, either single ('') or double (""). Another way is to use the String function. Likewise, the Number function can be used to turn a string into a Number, if the string is actually just a number in quotes.

JSBasics6

produces:

JSBasics7

When strings such as str1 and str2 are added, they are treated as strings, so "7" + "8" = "78"; however, if strings are multipled, they are treated as number, so str1 * str2 = 7 * 8 = 56. I'm not going to give a screenshot of this, but you can try this on your own by changing the plus symbols to multiplication symbols.

Next Time[]

Next time I will talk all about Functions and different things they can do. I think in the end this tutorial is going to be much longer than the HTML and CSS tutorial. This is what I have planned so far:

Schedule[]

  1. Docs and Vars (this blog)
  2. Functions
  3. Events
  4. Objects

As I learn more and more JavaScript, I will add some to this list, but for now, this is a good introduction. I also plan to make a video to review how you can use JavaScript on Wikia.

--Paper Out

Advertisement