(Adapted from www.javascriptmall.com/)
Javascript is a language which has many interesting characteristics. It is fast: JavaScript is 100% text, just like HTML is. Therefore it loads quickly from the server to your computer. JavaScript runs on your computer and does not have to download any additional applications to do its job. It can be mixed with HTML: You use the HTML tag combination <SCRIPT> </SCRIPT> to identify JavaScript. This makes it HTML friendly. It can be annoying to your visitors:
It can be frustrating to develop: When you make a mistake and try to trouble
shoot. But so can HTML! Have you ever left off a closing tag such as
</FONT> and spent some time trying to find the mistake among the
many tag combinations on your page. Exercise 01 a. According to the text above, name, in Portuguese, advantages and disadvantages of Javascript. Javascript is Object Oriented: JavaScript is composed of what is called
objects that have properties and methods. The window that you are now
using is an object that has properties such as height and width. Methods
do things for us. For instance, you can use a JavaScript method to open
a pop-up window. Some pop-up windows contain a close button. Pressing
the button causes another JavaScript method to run and close the window. Exercise 02 a. Complete: altura e largura são
exemplos de
. It is not Java: Java is a compiled language, i.e. put into machine language before it gets to your computer. JavaScript is an interpreted language, i.e. put into machine language on your computer. The coding in JavaScript is somewhat similar to Java but it is much less restrictive. For example, JavaScript allows you to assign any type of value to your variables. Java does not. Java is a language that experienced programmers use to develop applications. JavaScript is for us less experienced web developers. JavaScript was originally developed independent of Java by Netscape under the name of LiveScript. Netscape changed the name to JavaScript in 1995 as a result of an agreement with Sun, the developer of Java. It is called jscript by Microsoft: Microsoft Internet Explorer browsers have what is called jscript. The results from a browser that has jscript is basically the same as one that has JavaScript. The documentation that Microsoft provides makes it look a little different. Call it what you want to, the bottom line is that JavaScript works on the Internet Explorer browsers. Exercise 03 a. De acordo com o texto, qual
a diferença entre Java e Javascript? b. Complete: Java é uma linguagem mais apropriada para programadores , enquanto é mais apropriada para . Our First ScriptLet's start our journey into the learning of JavaScript by typing in the following HTML code. <HTML>
Not very exciting! Lets add some JavaScript to our code. Add the following script after the line <P>Today is <SCRIPT Language="JavaScript"> <HTML> Still not real exciting, but remember
this is only our first script and does demonstrate
something you can't do with plain HTML. Exercise 04 a. O resultado do script anterior
mostra um/uma
. The <SCRIPT> tags As a quick review, a simple HTML tag has the following syntax: <TAG-NAME [ATTRIBUTE=["VALUE"]....]> (some text) </TAG-NAME> Most browsers in use today have some version of JavaScript built in. However, there are still a few in use that don't understand JavaScript. These browsers will ignore the <SCRIPT> tag but will display the text between the tags. To prevent this, the JavaScript code is enclosed by a combination of the HTML comment tag <!-- --> and the double slash ( //) that is used in JavaScript to identify a comment. The result looks like this <!-- //-->. Exercise 5 a. De acordo com o
texto,
navegadores antigos
Javascript. Por isso, o código Javascript vem acompanhado
por uma
de tags que é usada em Javascript
. The complete template for JavaScript is therefore: <SCRIPT language="JavaScript"> (some text that is JavaScript code) //--> <SCRIPT language="JavaScript"><!-- (some text that is JavaScript code) //--></SCRIPT> Exercise 6 a. A melhor tradução para "template" é .
Our completed first Script Ok, add the two necessary lines to our first script to hide it from older browsers. Our completed HTML code should now look that shown below. Make sure that you reload the script in the browser to prove that it still works the same. <HTML> A little about the JavaScript code in our first Script Look closer at the completed version or our first Script. You should now be able to identify the <SCRIPT> tags and the text that is used to hide our code from the older browsers. The remaining two lines between the <SCRIPT> tags is JavaScript code. The first line initializes a date object. The other line of our code is a method of the document object. For now, all you need to know about it is that you can use this method to write information to the document contained in your browser.
We already know that we can put scripts between the <BODY> and </BODY> tags because that's where we put our first script. You can put JavaScript anywhere in the BODY section of HTML code. You can also put JavaScript in the HEAD section. The word function used in JavaScript may be used several times in the HEAD section of a HTML document. So it turns out that JavaScript can be placed most anywhere in our HEAD and/or our BODY sections. As you learn more about JavaScript, you will understand when you should put it in the HEAD section and when it should go in the BODY of the document. Our first JavaScript Error (hopefully!) I say hopefully because you might have already experienced this if had a typo in our script right above. Now to demonstrate one of the important characteristics of JavaScript, Change the words document.write to all caps like this DOCUMENT.WRITE(today). Save your file and reload it into the browser. Surprise! What happened? You got your first JavaScript error. Better get use to it. I try to do my work in small chunks so I can weed out the errors more easily. The more practice with error messages you have the easier it will be to decipher them. a. O autor tenta trabalhar usando
, de forma que ele possa
os erros
.
Here is a sample of how the error will look on the Netscape and Internet Explorer browsers. Yours may vary a little from this. Netscape 4 Internet Explorer 4 Internet Explorer 5
So, what caused our error here? The answer is "JavaScript is case sensitive". When I was first setting up this demo I entered Date as date. It took me a while to find out what was wrong. So be careful when you are entering JavaScript code to get the case right and be aware that it is likely that the wrong case could be your problem when you get a JavaScript error. Notice that all of the error messages show a line number that the error occurred on. In our simple case the line number is exactly where the error occurred. This will not always be the case as our scripts get more complex. However, it will give you some clue as to where to start looking. The error call out can be a little confusing and needs some getting use to. You probably want to change the case for "document.write" back to all small letters in our example script, save it and make sure it runs ok before we proceed further. Exercise 07 a. Check True or False.
More about document.write() The document.write() method is one that you will be using a lot. For now, don't worry too much about what a method is beyond our basic explanation we gave when we talked about JavaScript being Object Oriented. Just realize that you can use this method to write a string to the document while it is loading. The syntax for the document.write() method is as follows: document.write("string") So, what is a string? It is nothing more than a series of characters. You put the characters in quote marks, except when the string is something that is returned by another method, which was the case in our first script, or is a variable which you will also learn in the future. Exercise 8 a. De acordo com a passagem
acima um "string" é
. So if we wanted to write Welcome to my Web Page using document.write(), this is how we would do it: document.write("Welcome to my Web Page") You can include HTML tags in this string
if you want. For instance, we can make our welcome bold by doing the
following. I will add a second line too. Now suppose we want to use document.write() to insert an image in the document. Normally we would use the <IMG SRC > tag to do this. For instance, the tag would look something like this if we were inserting a pet's picture named pet.gif. <IMG src="pet.gif"> We will need to put quotes around this
when we use it with the document.write() method. This will
mean that we will have quotes within quotes. This will not work but
there is a solution. You alternately use single quotes and double
quotes in JavaScript if you need to put quotes within quotes.
Heres how we would do our image: or Either way will work fine. Don't forget that you must put our above example scripts between the <SCRIPT> </SCRIPT> tags for them to work. Confused yet? So are you completely confused yet? If you can
Then I would say you have learned a great deal in this lesson and are ready to move on and learn the basics on JavaScript. Assignment
1. Make a very simple web page
using a series of document.write() methods
to generate everything that you will see on the screen. This means that
all of your BODY section will be a series of document.write()
methods.
|
00:
Plano de Ensino
Unit 01: Creating a folder
Unit 02: Reading in English
Unit
03: What is Grammar
Unit 04: Yahoo Account
Unit 05: What is a computer
Unit
06: Guidelines for writing an Abstract
Unit 07: PC System
Unit 08: Linking Devices
Basic HTML
Unit 09: Faces of the Internet
Unit
10: Website Review I
Unit
11: Website Review II
Unit 12: Talking About Computers
Unit 13: Writing about yourself
Unit 14: Website Basics
©Sandro L. Sousa