1 / 8

JavaScript JS301

JavaScript JS301. Week 3: Practical JavaScript. Where does my JavaScript go?. Popular convention says the HTML head: <!DOCTYPE html> <html><head> <title>JS301</title> <script type="text/javascript"> document.write('Hello World!'); </script> </head> <body></body> </html>.

Download Presentation

JavaScript JS301

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. JavaScript JS301 Week 3: Practical JavaScript

  2. Where does my JavaScript go? Popular convention says the HTML head: <!DOCTYPE html> <html><head> <title>JS301</title> <script type="text/javascript"> document.write('Hello World!'); </script> </head> <body></body> </html>

  3. Where does my JavaScript go? For best performance, but it as close to the bottom of the document as you can: <!DOCTYPE html> <html> <head><title>JS301</title></head> <body> ... <script type="text/javascript"> document.write('Hello World!'); </script> </body> </html>

  4. Where does my JavaScript go? If you want to share JavaScript between HTML documents, include it from an external file: <script src="myscript.js" type="text/javascript"> </script>

  5. Form Validation • Alert users to problems before submitting to the server • Make sure to also validate on the server - never trust the client! • http://jsfiddle.net/zymsys/enDzA/

  6. AJAX • Interact with the server without page loads • Asynchronous JavaScript and XML • XHR: XMLHTTPRequest • Not limited to XML - I prefer JSON • http://jsfiddle.net/zymsys/sHhsf/

  7. Rich User Interfaces • Dialogs: http://jsfiddle.net/zymsys/HcnRd/ • Tabs: http://jsfiddle.net/zymsys/AcUqr/ • Input Controls: • Autocomplete: http://jsfiddle.net/zymsys/eZNQk/ • Buttons: http://jsfiddle.net/zymsys/HqEng/ • Dates: http://jsfiddle.net/zymsys/vgzGU/ • More: http://jqueryui.com/demos/

  8. Next Week • Knockout? • OOP? • Patterns? • Something else?

More Related