Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf

所需积分/C币:17 2017-10-05 13:32:17 7.61MB PDF
收藏 收藏

Beginning JavaScript with DOM Scripting and Ajax(2nd) 英文无水印pdf 第2版 pdf所有页面使用FoxitReader和PDF-XChangeViewer测试都可以打开 本资源转载自网络,如有侵权,请联系上传者或csdn删除 本资源转载自网络,如有侵权,请联系上传者或csdn删除
Contents at a glance About the authors About the technical reviewer Acknowledgments ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ XIX ntroduction nXXI Chapter 1: Getting started with Javascript Chapter 2: Data and Decisions ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 13 Chapter3: From DHTML to DOM Scripting…,…,…,…,,…,…,,,m49 Chapter 4: HTML and JavaScript mmmmBBBBRBRBRBRRRERRRER In 69 Chapter 5: Presentation and Behavior(CSs and Event Hand lingam 101 Chapter 6: Common Uses of JavaScript: Images and windows mmm m 149 Chapter 7: JavaScript and User Interaction: Navigation and Forms mann 199 Chapter 8: Back-End Interaction with Ajax and node js amammmmmmmmnn 247 Chapter 9: Data Validation Techniques mmammmmmmammammmmmmmmmmmmm 279 Chapter 10: Modern JavaScript Case Study: A Dynamic Gallery maam 297 Chapter 11: Using Third-Party JavaScript ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■a■■ 321 Appendix A: Debugging JavaScript ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 343 Index 361 Introduction JavaScript has gone though a huge transformation, from being something that was nice to know to being essential to developing web sites that are fully featured and take full advantage of the new capabilities built into browsers. The amount of attention given to JavaScript though libraries and frameworks has grown at an accelerated rate This was not always the case. JavaScript was first introduced as live Script in 1995 by Netscape Over time Microsoft's Internet Explorer adopted it and Netscape changed the name to JavaScript with the release of Netscape Navigator 2. As the two companies continued to compete, support was not that good. At worst, developers had to make two different versions of a site to support the most popular browsers(which, at the time, were Netscape 4 and Internet Explorer 4) Browser support has improved greatly. The World Wide Web Consortium(W3C), working with browser makers, developed a standard way of representing and interacting with HTML documents, called the Document Objet Model (DOM), and a scripting language, called ECMAScript. Over the years, compliance with these standards has improved This book starts with the basics and gives you a good foundation on how to write JavaScript in an unobtrusive way, keeping your structure (HTML), presentation( CSS), and behavior ( JavaScript)separate. There are also examples of how to keep your sites accessible for visitors using screen readers, as well as examples of how to develop your site if JavaScript is not available. We also cover subjects like objected detection versus browser detection, AJAX, HTML 5 Form validation, and an introduction to jQuery. The goal of this book is to help you understand JavaScipt. If you havent looked at JavaScript in a while, you'll be glad to know a lot has changed for the better. You can use this book as a guide to update your skills. If you are new to JavaScript, this book helps you from the beginning. We start with explaining what a variable is and later move on to how to add google maps to your site This book is full of examples you can use to enhance your site and add features based on the enhanced capabilities built into current browsers XXI CHAPTER 1 Getting Started with Javascript This book will teach you about JavaScript and how to use it in a practical manner. After you read it, you'll be able to Understand javaScript syntax and structures Create scripts that are easy to understand and maintain Write scripts that do not interfere with others Write scripts that make web sites easier to use without blocking out non-JavaScript users Write scripts that are independent of the browser or user agent trying to understand nem-which means that in some years they will still be usable and wont rely on obsolete technology Enhance a web site with JavaScript, and allow developers without any scripting knowledge to change the look and feel Enhance a web document with JavaScript, and allow html developers to use your functionality by simply adding a Css class to an element Use progressive enhancement to make a web document nicer only when and if the user agent allows for it Use Ajax to bridge the gap between the back end and client side, thus creating sites that are easier to maintain and appear much slicker to the user. Use Java Script as part of a web methodology that enables you to maintain it independently without interfering with the other development streams What you will not find here are JavaScript applications that are browser specific JavaScript that is only there to prove that it can be used and does not enhance the visitor's experience JavaScript that promotes unwanted content, such as pop-up windows or other flashy techniques like tickers or animation for animation s sake JavaScript is essential in modern web development, but you cannot take it for granted that the visitor will be able to use or even experience all the effects and functionality you can achieve with JavaScript. You can use JavaScrip to completely change the web page by adding and removing or showing and hiding elements. You can offer users richer interfaces such as drag-and-drop applications or multilevel drop-down menus. However, some visitors cannot use a drag-and-drop interface because they can only use a keyboard or rely on voice recognition to use our sites CHAPTER 1 GETTING STARTED WITH JAVASCRIPT Other visitors might be dependent on hearing our sites rather than seeing them(via screen readers and might not be notified of changes achieved via Java Script. Last but not least, there are users who just cannot have JavaScript enabled-for example, in high-security environments like banks. Therefore, you need to back up a lot of the things you do in javaScript with solutions on the server side Note Web design has matured over the years-long ago we stopped using FONT tags, and we deprecated visual attributes like bgcolor and started moving all the formatting and presentational attributes to a css file. The same cleaning process has also happened to JavaScript. Now the content, structure, presentation, and behavior of web sites are all separated from each other. Web development now is done for business and for helping the user rather than done for the sake of putting something out there and hoping it works in most environments JavaScript is now part of an overall development methodology, which means that you develop it not to interfere with other technologies like HTML or CSS, but to interact with them or complement them Web development has come quite a way since the 1990s, and there is not much sense in creating web sites that are static and fixed in size. Any modern web design should allow for growth as needed. It should also be accessible to might make sense on a high-resolution monitor but is hard to use on a mobile phone or a tablet)-and ready for ble, everyone(which does not mean that everybody gets the same appearance-a nice multicolumn layout, for example, internationalization. You cannot afford any longer to build something and think it'll last forever. Because the Web is about content and change, it 'll become obsolete if we don' t upgrade our web products constantly and allow other data sources to feed into it or get information from it Enough introductions-you got this book to learn about JavaScript, so let's start by talking quickly about JavaScript's history and assets before diving right into it In this chapter, youll learn What JavaScript is, and what it can do for you The advantages and disadvantages of JavaScript How to add JavaScript to a web document, and what its essential syntax is Object-oriented programming(OoP)in relation to JavaScript How to write and run a simple JavaScript program Chances are that you have already come across Java Script and already have an idea of what it is and what it can do, so we'll move quite swiftly through some basics of the language and its capabilities first. If you know JavaScript well already, and you simply want to know more about the newer and more accessible features and concepts, you might skip to Chapter 3. However, there might be some information you've forgotten, and a bit of a review doesn't hurt, either The Why of JavaScript In the beginning of the Web, there was hTMl and the Common Gateway Interface(CGI). HTML defines the parts of a text document and instructs the user agent(usually the web browser how to show it--for example, text surrounded by the tags p></p> becomes a paragraph. Within that paragraph, you might have <h1></h1> tags that define the main page heading. Notice that for most opening tags, there is a corresponding closing tag that begins with HTML has one disadvantage-it has a fixed state. If you want to change something, or use data the visitor entered, you need to make a round-trip to a server. Using a dynamic technology (such as Cold Fusion, Ruby on Rails, ASP.NET, PHP, or JSP), you send the information from forms, or from parameters, to a server, which then performs calculations, tests, database lookups, and other such tasks. The application server associated with these technologies then writes an htML document to show the results, and the resulting html document is returned to the browser for viewing CHAPTER 1 GETTING STARTED WITH JAVASCRIPT The problem with that is it means every time there is a change the entire process must be repeated (and the page reloaded). This is cumbersome and slow. It is true that at least the Western world has the benefit of fast Internet connections these days, but displaying a page still means a reload, which could be a slow process that frequently fails (Ever get an Error 404 Some information, such as the results of performing calculations and verifying the information on a form might not need to come from the server. JavaScript is executed by the user agent (normally a browser ) on the visitor's computer. We call this client-side code. This could result in fewer trips to the server and faster-running web sites What Is JavaScript? JavaScript started life as LiveScript, but Netscape changed the name-possibly because of the excitement being generated by Java-to JavaScript. The name is confusing, though, because there is no real connection between Java and Java Script-although some of the syntax looks similar Java s to JavaScript what Car is to Carpet From a JavaScript discussion group on Usenet Netscape created the JavaScript language in 1996 and included it in their Netscape Navigator(NN)2.0 browser via an interpreter that read and executed the JavaScript added to. html pages. The language has steadily grown in popularity since then, and it is now supported by all browsers and some applications as a way to customize them The good news is that this means JavaScript can be used in web pages for all browsers. The not-quite-S0-good news is that there are differences in the way the different browsers implement JavaScript, although the core JavaScript language is much the same. However, JavaScript can be turned off by the user. I will discuss this further shortly, as well as throughout this book. The great thing about Java Script is that once you',ve learned how to use it for browser programming, you can move on to use it in other areas. Microsoft Windows 8 and Surface tablets both let you use JavaScript to develop applications, PDF files use JavaScript, and applications such as Dreamweaver and Photoshop are scriptable with JavaScript. Now mobile applications can be developed with JavaScript and converted to native code. JavaScript can even be used on the server side using things like Node. js A lot of large companies also offer software development kits(SDKs that let you access data or integrate services on your site. For example, if you want your visitors to log in with their Facebook ID, you can use Facebook's JavaScript Sdklocatedathttp://developers.facebookcom/web/. Even better is the fact that Java Script is a lot easier to develop than higher programming languages or server-side scripting languages. It does not need any compilation like Java or C++, and it doesnt need to be run on a server or command line like Perl, PHP, or Ruby. All you need to write, execute, debug, and apply Java Script is a text editor and a browser-both of which are supplied with any operating system. There are, of course, tools that make it a lot easier for you-for example, JavaScript debuggers like Firebug, Opera Dragonfly, and Chrome Developer tools Problems and Merits of JavaScript As mentioned at the outset of this chapter, JavaScript has been an integral part of web development over the last few years, but it has also been used incorrectly. As a result, it has received a bad reputation. The reason for this is the use of gratuitous JavaScript effects, like moving page elements and pop-up windows. These effects might have been impressive the first time you saw them, but they soon become just a"nice to have"feature and, in some cases, even a"nice to not have any longer"element. a lot of this comes from the days of dhtml (which I'll say more about in hapter 3) CHAPTER 1 GETTING STARTED WITH JAVASCRIPT The term user agent and the lack of understanding of what a user agent is can also be a problem. Normally, the user agent is a browser like Microsoft Internet Explorer(IE), Chrome, Firefox(Fx), Opera, or Safari. However, browsers are not the only user agents on the Web Others include Assistive technology that helps users to overcome the limitations of a disability-like text -to-speech software or braille displays Text-only agents like lynx Web-enabled applications Browsers in game consoles Browsers in smartphones Browsers in tablets Interactive TV and set-top boxes Search engines and other indexing programs And many more This large variety of user agents, of different levels of technical finesse(and old user agents that don' t get updated), is also a great danger for JavaScript Not all visitors to your web site will experience the JavaScript enhancements you applied to it. A lot of them will also have Java Script turned off--for security reasons. JavaScript can be used for good and for evil. If the operating system-like unpatched Windows-allows you to, you can install viruses or Trojan Horses on a computer via JavaScript or read out user information and send it to another server Note There is no way of knowing what the visitor uses or what his computer is capable of. Furthermore, you never know what the visitor 's experience and ability are this is one of the beautiful aspects of the Web -everyone can participate. However, this can introduce a lot of unexpected consequences for the JavaScript programmer. In many cases, you might want to have a server-side backup plan. It would test to see whether the user agent supports the functionality desired and, if it doesnt, the server takes over. Independence of scripting languages is a legal requirement for web sites, as defined in the Digital Discrimination Act for the UK, section 508 in the US law, and many more local legal requirements throughout the world. This means that if the site you developed cannot be used without JavaScript, or your JavaScript enhancements are expecting a certain ability of the users or their user agent without a fallback, your client could be sued for discrimination However, JavaScript is not evil or useless, and it is a great tool to help your visitors to surf web sites that are a lot slicker and less time-consuming The merits of using JavaScript are Less server interaction You can validate user input before sending the page off to the server This saves server traffic, which means saving money Immediate feedback to the visitors They don' t have to wait for a page reload to see if they forgot to enter something Informing the visitor of minor errors For example, if you need your visitors to fill out a form, Java Script can provide instant feedback on how the form was filled out. If a required field is missing, the site can inform the user before submitting any data to the server CHAPTER 1 GETTING STARTED WITH JAVASCRIPT Increased usability by allowing visitors to change and interact with the user interface without reloading the page For example, by collapsing and expanding sections of the page or offering extra options for visitors with JavaScript. A classic example of this is selection boxes that allow immediate filtering, such as only showing the available destinations for a certain airport, without making you reload the page and wait for the result Increased interactivity You can create interfaces that react when the user hovers the pointer over them or activates them via the keyboard. This is partly possible with cascading style sheets(CSS )and HTML as well, but Java Script offers you a lot wider-and more widely supported-range of options Richer interfaces If your users allow for it, you can use Java Script to include such items as drag-and-drop components and sliders-something that originally was possible only in thick client applications your users had to install, such as Java applets or browser plug-ins like Flash Lightweight environment Unlike Java applets or Flash movies, which are large files that must be downloaded, scripts are small in file size and get cached (temporary storage )once they have been loaded java Script also uses the browser controls for functionality rather than its own user interfaces like Flash or Java applets do. This makes it easier for users, because they already know these controls and how to use them Modern Flash and apache flex applications do have the option to stream media and-being vector based-are visually scalable, something JavaScript and hTML controls arent. On the other hand, SVG Scalable Vector Graphics) is something native to the browser and can be controlled by Java Script Javascript in a Web Page and essential syntax Applying JavaScript to a web document is very easy; all you need to do is use the script tag. The type attribute is optional in htML5 but required in HTML4 <script type="text/javascript> / Your code here </script> For older browsers, youll need to comment out the code to make sure the user agent does not display it inside the page or try to render it as HTML markup There are two different syntaxes for commenting out code but we are showing one For HTML documents, you use the normal HTML comments <script type=text/javascript"> <! / Your code here </script> Technically, it is possible to include JavaScript anywhere in the hTMl document, and browsers will interpret it. However, there are reasons in modern scripting why this is a bad idea. For now, though, we will add JavaScript examples to the body of the document to allow you to see immediately what your first scripts are doing. This will help you get familiar with Java Script a lot more easily than the more modern and advanced techniques awaiting you in Chapter 3 CHAPTER 1 GETTING STARTED WITH JAVASCRIPT Note There is also an opposite" to the script tag--noscript--which allows you to add content that will be displayed only when JavaScript is not available. However, noscript is deprecated in XHTML and strict HTML, and there is no need for it-if you create Javascript that is unobtrusive Javascript syntax Before we go any further, we should discuss some Java Script syntax essentials / indicates that the rest of the current line is a comment and not code to be executed, so the interpreter doesn't try to run it. Comments are a handy way of putting notes in the code to remind you what the code is intended to do, or to help anyone else reading the code see what's going on. ./ indicates the beginning of a multiline comment indicates the end of a comment that covers more than one line Multiline comments are also useful if you want to stop a certain section of code from being executed but dont want to delete it permanently. If you are having problems with a block of code, for example, and you aren't sure which lines are causing the problem, you can comment one portion of it at a time to isolate the problem Curly braces and ) are used to indicate a block of code. They ensure that all the lines inside the braces are treated as one block you will see more of these when i discuss structures such as if or for as well as functions A semicolon or a newline defines the end of a statement and a statement is a single command. Semicolons are in fact optional, but it's still a good idea to use them to make clear where statements end, because doing so makes your code easier to read and debug. (Although you can put many statements on one line, it,'s best to put them on separate lines to make the code easier to read .) Let's put this syntax into a working block of code <! DOCTYPE html> <html> <body> <script type="text/JavaScript"> / One-line comments are useful for reminding us what the code is doing This is a multiline comment. It's useful for longer comments and also to block out segments of code when you 're testing Script starts here. We re declaring a variable myName, and assigning to it the value of whatever the user puts in the prompt box(more on that in Chapter 2),finishing the instruction with a semicolon because it is a statement var my Name prompt ("Enter your name",";

试读 127P Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf
立即下载 身份认证后 购VIP低至7折
  • 至尊王者

关注 私信
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf 17积分/C币 立即下载
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第1页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第2页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第3页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第4页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第5页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第6页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第7页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第8页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第9页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第10页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第11页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第12页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第13页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第14页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第15页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第16页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第17页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第18页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第19页
Beginning JavaScript with DOM Scripting and Ajax(2nd) 无水印pdf第20页

试读结束, 可继续阅读

17积分/C币 立即下载