Learn JavaScript notes

The Special Data Type of JavaScript learning notes is: * undefinedvar A; // declare a variable, but it is not assigned alert (a); // but it still has a value, its value is undefined alert (B); // but note that an error will occur when an undefinednan variable is output, rather than a special value, it means "not a number"-it is not a number. If another value fails to be converted to a number, the value var STR = "some string here! "; Var num = 123; alert (Str * num); // Nan is output, because the multiplication operator can only be used for numbers, therefore, during the operation, the computer will convert the field string to the numeric bool type to VaR STR = "some string"; alert (!! Str); // true, because non-operators operate on boolean values, to convert other types to boolean values, you only need to convert them non-two consecutive STR = ""; alert (!! Str); // output false. The value is false only when an empty string is converted to a Boolean value. If a non-empty string is converted to a Boolean value, truevar num = 0 is returned. Alert (!! Num); // falsenum =-123.345; alert (!! Num); // true. It is true to convert any number except 0 to a Boolean value. // It is also very important that, converting an empty string to a number will be 0 alert ("" * 1); // output 0 to get the variable type typeof operator using window. the prompt can pop up a window containing an input box. The user input will be the built-in object math and datedate returned by this function, which are like a time machine var d = new date (); // create a date object. The value range of the date object must be approximately January 1, 1970 years before and after January 1, 285,616. Alert (d); // directly output this object. There are some methods to obtain a time string. Alert (D. getyear (); // obtain the year, // The Personal test shows a problem. Alert (D. getfullyear (); // always returns the 4-digit expression of the year alert (D. getmonth (); // returns the month. Note that the month is counted from 0, so 0 alert (D. getdate (); // returns the number of alert (D. getday (); // returns the day of the week today, 0 on Sunday, and 1 on Monday .... alert (D. gethours (); // returns the hour alert (D. getminutes (); // returns the minute alert (D. getseconds (); // returns the second Alert (D. getmilliseconds (); // returns millisecond // The Personal test does not support one alert (D. gettime ()) Returns an integer that represents the number of milliseconds between the time calculated from January 1, January 1, 1970 and the time in the date object. The date range is approximately January 1, 1970 years before and after midnight of January 1, 285616, A negative number indicates that we can not only obtain the time value from the date before January 1, 1970, you can also set the time value to the time set function corresponding to those getxxx methods by changing get to setvar d = new date (); D. setfullyear (1690); // set the year to 1900 alert (D. getfullyear (); // The system returns the 1900 alert (D. gettime (); // the output value is negative, which verifies the preceding gettime () the biggest benefit of a method like setxxx is that if we set an incorrect value, the script will not make an error, but the date will be automatically corrected and remembered, the month is an array that starts counting from 0, the same as the object array and date. It is also a built-in object. You need to use the new operator to create var arr = new array. (); The array length in Javascript will automatically increase, and the Length attribute will automatically update arr = new array (6); // the expected effect will not be achieved, this is because an empty array with a length of 6 can also be declared using the array literal method arr = []; // an air bracket is almost equivalent, but it is more flexible and simple. Strings, values, and boolean values can be mixed in an array ..., almost all types of values, including array arr = new array (, 0, true, "some string", new array ("A", 3 )); // The fifth element is an array alert (ARR [4]); // output "A", 3 alert (ARR [4] [0]); // output "a" to add to the array and delete the element (push, delete) Arr. push (a); // The Push method adds the element to the array before the end of arr. push ("A", "B"); // you can add multiple elements at a time. Arr [arr. length] =" New element "; using Delete is the same as the following statement. Arr = [" # "," $ "," % "]; alert (ARR); arr [2] = undefined; // undefined is a value alert (ARR); join method. It returns the same var arr = new array () as the array of all elements in the array separated by the specified separator (); vaR OBJ = new object (); alert (typeof ARR); // objectalert (typeof OBJ); // The object array can use the VaR person = new array (); person ["Age"] = 18; // note that the subscript in brackets is a string, so you need to use the quotation mark person ["weight"] = "123 "; person ["height"] = "170"; person ["arm"] = 2; perso N ["Leg"] = 2, and the object can also access its property var OBJ = new object (); obj. property = "some data"; alert (OBJ ["property"]); // "some data" // Of course, you can also use the numerical subscript OBJ [1] = 123; alert (OBJ [1]); // 123 alert (obj. property); // "some data" alert (obj. length); // but unlike the array, it does not have the Length attribute. The output undefined corresponds to the array literal, the object literal declaration method var OBJ = {A: 123, // here a, B, etc. are also the object's attribute name B: 456 // note, finally, there is no comma}. You can also write OBJ = {"A": 345, // although if it is caused by quotation marks, you can use spaces and other characters that do not conform to the variable naming rules, but it is strongly not recommended "B": 333}; .. In... loop appears (for the study object, the for in loop is too useful) The String object and some methods and properties for the string STR = new string ("some string here "); // on the surface, this is the same effect as the directly created string STR = "some string here"; however, the new string () is used (); the created object is Var STR = new string (); alert (typeof Str); // object // because it is an object, therefore, there are naturally many attributes and method strings. There are also many such methods used to process the string and some attributes • Length attribute, and return the length of the string • indexof method, returns the character position • lastindexof method for the first occurrence of the substring in the string, returns the position at which the substring finally appears • charcodeat method, returns an integer representing the Unicode encoding of the character • fro The mcharcode method returns a string from some UNICODE character values • Replace Method for text replacement, returns the replace of the replaced string • substr method, returns a substring • substring method of the specified length starting from the specified position, returns the substring • tolowercase method at the specified position in the string object, returns a string, the letter in the string is converted to a lower-case letter • touppercase method, returns a string, all letters in the string are converted to uppercase letters • split method, split the string into a string array. The script tag and the this object accessing the HTML page are a persistent object that cannot be declared (this is the keyword). Here, this refers to "this", which refers to this tag! For HTML elements, JavaScript automatically parses them into an object. We recommend that you place the script in the head part! So, this requires another event Onload Window. onload = initall; // write all the code in a function, and register it to the onload event attribute of the window object. // window Indicates the window object. As long as the window opens, it always exists, after the page is loaded, the onload event function initall () {var IMG = Document on the window object is triggered. getelementbyid ("myimg"); IMG. onclick = myfn; function myfn () {alert ("image Loading completed! ") ;}} In this way, the code will not go wrong. No matter where the script is placed, initall will be executed to access the HTML page only after the page is loaded: HTML domhtml Dom treats the entire page as a document object, and the tags in HTML must be accessed through the document object. each tag in the document is converted into an object <P class = "Demo" Title = "first section: DOM tree "id =" p1 "> we use a p tag for demonstration </P>. It is converted to the following object {tagname:" P ", classname: "Demo", title: "First paragraph: DOM tree", ID: "p1", innerhtml: "We use a p tag to demonstrate"} you may be surprised, why does the class attribute of a tag become the object's classname attribute instead of the class. class is a reserved JavaScript word !!! Tagname indicates its tag name, while innerhtml indicates its HTML code browsing. After HTML tags are converted into such objects, accessing the tag attributes or content in Javascript is much simpler, but the question is how to access this object !! * First add an ID to the label and then use document. the getelementbyid method can be used to access it. Note that you should put the code of the HTML page to be accessed on the onload event processing of the window! Window. onload = initall; function initall () {var P = document. getelementbyid ("p1"); alert (P. classname); alert (P. tagname); alert (P. title); alert (P. ID); alert (P. innerhtml);} it's so easy to access the HTML page! After obtaining an element, you can not only read its property value, but also set its property value! With this, we can already make some exciting things! // Some CSS. over {color: red; Background: Blue; font-size: larger ;}. out {color: black; Background: white; font-size: smaller ;}. click {color: yellow; Background: yellow; font-size: 12px;} // html code <p id = "p1" class = "out"> A large line of text, they are all common texts! </P> // JavaScript code window. onload = initall; function initall () {var P = document. getelementbyid ("p1"); p. onclick = clickfn; // The event registration method here is not less than the intra-row registration method, but the other is the same p. onmouseover = overfn; p. onmouseout = outfn;} function clickfn () {This. classname = "click"; // here, this is also available // note that it is classname, not class} function overfn () {This. classname = "over";} function outfn () {This. classname = "out" when you get the page element. Doc ument. getelementsbytagname The method can also obtain page elements, which are obtained through HTML tags rather than ID. because an HTML page has a unique ID and most tags are the same, the getelementsbytagname method has only one parameter, that is, the tagname in the string format ), the returned value is an array-like HTML element List window. onload = initall; // It is still written in window. function initall () {var plist = document. getelementsbytagname ("p"); // Why should I use uppercase P? In fact, it can be written in lower case P, not case sensitive, but because the tagname of the object is reported in upper case alert (plist. length); // similar to an array, length reports the number of elements and the number of P tags on the page. Alert (plist [0]. innerhtml); // This way to access the first P element}. In addition, for document. the getelementsbytagname method can also pass a "*" number as a parameter to obtain all elements of the page, similar to the wildcard window in CSS. onload = initall; function initall () {var allthings = document. body. getelementsbytagname ("*"); // The getelementsbytagname method can be called on any dom element. When this method is called on the body, tags outside the body will not get alert (allthings. length );// The number of tags on the page is reported (including doctype) Alert (allthings [3]. innerhtml); // This way to access the fourth element} javascript: pseudo protocol is different from the real existence of the Internet such as http: //, https: //, ftp: //, but used to associate the application. for example, Tencent: // (associated with qq), data :( base64 encoding is used to output binary files in the browser), and javascript: the pseudo Protocol has a problem, it will return the execution result to the page of course <a href = "javascript: window. prompt ('input content will replace the current page! ', '');"> A </a> the solution is simple <a href = "javascript: window. Prompt ('input content will replace the current page! ', ''); Undefined;"> A </a> // Add undefined to the end. Although the Javascript pseudo protocol provides some flexibility, try not to use it on the page! For JavaScript debugging, the Javascript pseudo protocol is very useful!