1 / 16

Browser Object Model& Debugging

Browser Object Model& Debugging. CSc 2320 Fall 2013. Disclaimer: All words, pictures are adopted from “Simple JavaScript”by Kevin Yank and Cameron Adams and also from W3schools. Edited by Guoliang Liu, Only for Course CSc2320 at GSU CS Department. In this chapter.

becka
Download Presentation

Browser Object Model& Debugging

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. Browser Object Model& Debugging CSc 2320 Fall 2013 Disclaimer: All words, pictures are adopted from “Simple JavaScript”by Kevin Yank and Cameron Adams and also from W3schools. Edited by Guoliang Liu, Only for Course CSc2320 at GSU CS Department

  2. In this chapter • Browser Object Model (BOM) • Debugging

  3. Browser Object Model (BOM) • BOM • No official standards (DOM has) • Includes: • Global variables • Global functions • DOM • window.document.getElementById("header"); • Screen • Location • History • Navigator • Pop-ups • Timing • Cookies

  4. Browser Object Model (BOM) • Window • Two properties: • window.innerHeight: the inner height of the browser window • window.innerWidth: the inner width of the browser window • Functions: • window.open() - open a new window • window.close() - close the current window • window.moveTo() -move the current window • window.resizeTo() -resize the current window

  5. Browser Object Model (BOM) • Screen • Get it by using window.screen • Properties: • screen.availWidth - available screen width • screen.availHeight - available screen height • E.g.,

  6. Browser Object Model (BOM) • Location • Get it by using window.location • Properties: • location.hostname • location.pathname • location.port (80) • location.protocol (http or https) • location.href: return the url • Function: • window.location.assign(): change the location

  7. Browser Object Model (BOM) • History • Get it by using window.history • Functions: • history.back() • history.forward() • E.g., • <script> function goBack()  {window.history.back();  } </script>

  8. Browser Object Model (BOM) • Navigator: • Get it by using window.navigator • Methods: • Depends on browsers and not accurate. • E.g., • Check the navigator

  9. Browser Object Model (BOM) • Pop-ups • Alert box • Window. alert(); • Confirm box • Window.confirm(); • E.g., confirm box • Prompt box • Window.prompt (); • E.g., prompt box

  10. Browser Object Model (BOM) • Timing • The timing functions in animation in last lecture.

  11. Browser Object Model (BOM) • Cookies • Get it by using document.cookie • What is cookie and where is it? • Variables store user information • In visitor’s computer

  12. Debugging • Common errors • Syntax errors • Compiler never goes through • Runtime errors • E.g., overflow problems • Logic errors • Does not behave as expected

  13. Debugging • How to debug? • Tools in browser • Simple tools with debugging in all kinds of browser • IE, Firefox, Chrome and so on. • Plug-ins in Firefox • Firebug • Test in the browser

  14. Debugging • How to prevent syntax errors and easily locate the errors. • Make it readable. • Keep your code incident for each block • Use editors with type verification • Eclipse

  15. Debugging • Be aware of runtime errors. • Define appropriate data types for variables. • Int, float, double all have their range according to different kinds of languages. • Keep your eye on the static array size, avoid the overflow. • Keep your logic strict when you code instead of when you debug. • In your mind, never consider your program job as two parts: edit and debug. • Be aware of polymorphism of functions, scope of variables. • Add brief comments when you program big!

  16. Debugging • Output debugging for programmers • Output something in some point of your program. • Spirit: similar with adding breaking point. • Advantages: Divide your code and nail each bug in each part.

More Related