Saltar al contenido principal
CargarIdioma (ES)Atención al cliente
EmpresarialesMóvilRedes socialesMarketingTecnologíaArte y fotografíaEmpleoDiseñoEducaciónPresentaciones y charlas públicasGobierno y org. sin ánimo de lucroAtención sanitariaInternetDerechoLiderazgo y gestiónMotorIngenieríaSoftwareReclutamiento y RR. HH.Venta al por menorVentasServiciosCienciasPYMES y liderazgoAlimentaciónMedio ambienteEconomía y finanzasDatos y análisisRelaciones con inversoresDeportesMeditaciónNoticias y políticaViajesDesarrollo personalSector inmobiliarioEntretenimiento y humorSalud y medicinaDispositivos y hardwareEstilo de vida
Subido porJonnJorellPunto
PPTX, PDF125 vistas

JavaScript - Getting Started.pptx

JavaScript is a programming language that allows web pages to be more interactive and dynamic. To add JavaScript to a web page, code is placed between opening and closing <script> tags, which can be inside the <head> or <body> sections. JavaScript code can either be directly written in the HTML file between <script> tags, or it can be saved in an external .js file and linked using the src attribute of the <script> tag. A basic "Hello World" JavaScript program uses the document.write() function to output text directly onto the web page. External JavaScript files allow code to be shared across multiple pages and edited in one place.

Educación◦
Descargar para leer sin conexión
JavaScript GETTING STARTED WITH JAVASCRIPT
INTRODUCTION OF PROGRAMMING BASIC JAVASCRIPT CONCEPT AND PROGRAMMING WRITING YOUR FIRST JAVASCRIPT CODE Writing your first JavaScript Program
Introduction For a lot of people, the term “computer programming” conjures up visions of super-intelligent nerds hunched over keyboards, typing nearly unintelligible gibberish for hours on end. And, honestly, some programming is like that. Programming can seem like complex magic that’s well beyond the average mortal. But many programming concepts aren’t difficult to grasp, and as programming languages go, JavaScript is relatively friendly to nonprogrammers. Still, JavaScript is more complex than either HTML or CSS, and programming often is a foreign world to web designers; so one goal of this book is to help you think more like a programmer. Throughout this book, you’ll learn fundamental programming concepts that apply whether you’re writing JavaScript, ActionScript, or even writing a desktop program using C++. More importantly, you’ll learn how to approach a programming task, so you’ll know exactly what you want to do before you start adding JavaScript to a web page. Many web designers are immediately struck by the strange symbols and words used in JavaScript. An average JavaScript program is sprinkled with symbols ({ } [ ] ; , () and full of unfamiliar words (var, null, else if). It’s like staring at a foreign language, and in many ways, learning a programming language is a lot like learning another language. You need to learn new words, new punctuation, and understand how to put them together so you can communicate successfully..
What is JavaScript? JavaScript is a programming language that lets you supercharge your HTML with animation, interactivity, and dynamic visual effects. JavaScript can make web pages more useful by supplying immediate feedback. For example, a JavaScript-powered shopping cart page can instantly display a total cost, with tax and shipping, the moment a visitor selects a product to buy. JavaScript can produce an error message immediately after someone attempts to submit a web form that’s missing necessary information.
How to add JavaScript to a Page Web browsers are built to understand HTML and CSS and convert those languages into a visual display on the screen. The part of the web browser that understands HTML and CSS is called the layout or rendering engine. But most browsers also have something called a JavaScript interpreter. That’s the part of the browser that understands JavaScript and can execute the steps of a JavaScript program. Since the web browser is usually expecting HTML, you must specifically tell the browser when JavaScript is coming by using the tag, it knows it’s reached the end of the JavaScript program and can get back to its normal duties.
How to add JavaScript to a Page Much of the time, you’ll add the <script> tag in the <head> portion of the web page like this : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/ html4/strict.dtd"> <html> <head> <title>My Web Page</title> <script type="text/javascript"> </script> </head> The <script> tag’s type attribute indicates the format and the type of script that follows. In this case, type=“text/javascript” means the script is regular text (just like HTML) and that it’s written in JavaScript.
How to add JavaScript to a Page If you’re using HTML5, life is even simpler. You can skip the type attribute entirely: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>My Web Page</title> <script> </script> </head> In fact, web browsers let you leave out the type attribute in HTML 4.01 and XHTML 1.0 files as well—the script will run the same; however, your page won’t validate correctly without the type attribute This book uses HTML5 for the doctype, but the JavaScript code will be the same and work the same for HTML 4.01, and XHTML 1.
How to add JavaScript to a Page You then add your JavaScript code between the opening and closing <script> tags: <!doctype html> <html> <head> <meta charset="UTF-8"> <head> <title>My Web Page</title> <script> alert('hello world!'); </script> </head> You’ll find out what this JavaScript does in a moment. For now, turn your attention to the opening and closing <script> tags. To add a script to your page, start by inserting these tags. In many cases, you’ll put the <script> tags in the page’s <head> in order to keep your JavaScript code neatly organized in one area of the web page.
External JavaScript Files Using the <script> tag as discussed in the previous section lets you add JavaScript to a single page. But many times, you’ll create scripts that you want to share with all of the pages on your site. For example, you might use a JavaScript program to add animated, drop-down navigation menus to a web page. You’ll want that same fancy navigation bar on every page of your site but copying and pasting the same JavaScript code into each page of your site is a bad idea for several reasons. First, it’s a lot of work copying and pasting the same code repeatedly, especially if you have a site with hundreds of pages. Second, if you ever decide to change or enhance the JavaScript code, you’ll need to locate every page using that JavaScript and update the code. Finally, since all the code for the JavaScript program would be in every web page, each page will be that much larger and slower to download.
External JavaScript Files A better approach is to use an external JavaScript file. If you’ve used external CSS files for your web pages, this technique should feel familiar. An external JavaScript file is simply a text file that ends with the file extension .js—navigation.js, for example. The file only includes JavaScript code and is linked to a web page using the <script> tag. For example, to add a JavaScript file named navigation.js to your home page, you might write the following: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>My Web Page</title> <script src="navigation.js"></script> </head>
External JavaScript Files The src attribute of the <script> tag works just like the src attribute of an <img> tag, or an <a> tag’s href attribute. In other words, it points to a file either in your website or on another website. <script src="navigation.js"></script> <script > alert('Hello world!'); </script> Note: When adding the src attribute to link to an external JavaScript file, don’t add any JavaScript code between the opening and closing <script> tags. If you want to link to an external JavaScript file and add custom JavaScript code to a page, use a second set of <script> tags.
External JavaScript Files In addition, you can attach external JavaScript files and add a JavaScript program to the same page like this: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>My Web Page</title> <script src="navigation.js"></script> <script src="slideshow.js"></script> <script> alert('hello world!'); </script> </head> Just remember that you must use one set of opening and closing <script> tags for each external JavaScript file. Note: Sometimes the order in which you attach external JavaScript files matters. As you’ll see later in this book, sometimes scripts you write depend upon code that comes from an external file. That’s often the case when using JavaScript libraries (JavaScript code that simplifies complex programming tasks).
Your First JavaScript Program To write a JavaScript, you need a web browser and either a text editor or an HTML editor. Once you have the software in place, you can begin writing JavaScript code. To add JavaScript code to an HTML file, create or open an HTML file with your text/HTML editor. A basic HTML file has a docType and some basic HTML tags, such as <html>, <head> and <body>. For example, a basic HTML5 file might look something like this <!DOCType HTML> <html> <head> <title>Testing JavaScript</title> </head> <body> [Content goes here] </body> </html>
Your First JavaScript Program When you see JavaScript code on the Web, you will sometimes see some JavaScript code between the <head></head> tags. Or you may see it in the <body></body> tags (or even in both places). To separate JavaScript code from HTML code, you need to enclose it within a set of <script></script> tags. The opening <script> tag has one required attribute and one optional attribute. The required attribute is the type attribute, while the optional attribute is src (which allows you to point to an external script file, covered later in this answer). The value of the type attribute is set to text/javascript, as shown below. <script type="text/javascript"> Your JavaScript code goes here. </script>
Your First JavaScript Program As you can see, your JavaScript code is placed between the opening and closing script tags. For example, script, you could write a simple string of text directly on the web page, as shown below (placed between the <body> and </body> tags). As you can see, your JavaScript code is placed between the opening and closing script tags. For example, script, you could write a simple string of text directly on the web page, as shown below (placed between the <body> and </body> tags). In the example above, the standard JavaScript function displays text between the quotation marks on the page. It would look like the example below. <script type="text/javascript"> document.write("Text written using JavaScript code!"); </script> document.write("Text written using JavaScript code!");
Your First JavaScript Program Text written using JavaScript code! Another option for including JavaScript on a page is creating the script in an external text file. Save that file with a .js extension, making it a JavaScript file. The .js file is then included in the page using the src attribute of the opening script tag. For example, to use the script above, place the JavaScript code (without script tags) into a new text file, as shown below. You would then save the file with a .js extension. For instance, you could save it as write.js. Once the file is saved, you can call it from the HTML code via the src attribute of the opening script tag, as shown below for write.js. document.write("Text written using JavaScript code!"); <script type="text/javascript" src="write.js"></script>
Your First JavaScript Program The procedure above has the same effect as writing the code between the script tags but won't clutter the HTML code with JavaScript. Another advantage is that the same script can be included in multiple pages and editing the script file updates the script in every page that uses the external script file. Editing the script file is helpful as it can be done in one place, rather than editing the code on each page containing the script.
Thank you