JS Learning Notes

Source: Internet
Author: User
Tags bitwise operators


First, JS how to run
Second, the output
document.write ();
Alter ();
Third, how to use JS in HTML
1. Use <script></script> to embed JS syntax into HTML, you can use more than one, each one is related;
2.href = "javascript: Code";
3. In various response events
4. Write to external file (. js) <script src = "relative path" ></script>
JS syntax
Naming conventions:
1. Name to make sense
2. Cannot start with a number, cannot be a system keyword ($a legal)
Case: JavaScript is case-sensitive
Variable name and function: The first letter of each word is capitalized
Object: Capitalize the first letter of each word
Semicolon:
Function Execution statement: Add semicolon (end of line wrapping default statement)
struct definition statement: no semicolon
Comments:
Single
/* * * Multiple lines
Iv. variables
var a = 10; Memory release is not released until you close the browser
var variable name = value;
Note: JavaScript is a weakly typed language (as with PHP)

V. Types of data
typeof (variable name);
1.number (int, float, double) Note: Formulas are also separated by integral type and floating point type
2.string (String, char)
3.boolean (BOOL)
4.object (object type, array, NULL) Note: separate processing
5.undefined no variable declared

Functions Type: function

Vi. operator Expressions
Arithmetic operators: +-*/% + +--
Plus: Connection strings and addition operations
Remainder: Weak type language allows floating-point number to be taken
Assignment operator: = = = = *=/=%=
Conditional operator:> < = = = >= <= = = =!==
Logical operator:&& | | ^
Bitwise operators:>> >>> << | & ~
Other operators:? :
Seven, Process Control
Viii. Functions
is a section of code that has been "named" to complete a "specific feature" (which can be called before a declaration or after a declaration)
1. Function names, which represent the entire function when the function name is not bracketed
2. Parameters: Use parameters as required
3. Function body
4. Return value (no return value is a procedure, and return value is a function)

callback function
To manipulate functions as arguments

-----------------------------------------------------------------------------------------------------------

The Declaration and application of JS array

1. Use the declaration of an array as long as it is batch data
The function of an array

Second, how to declare an array
A. Methods for declaring arrays quickly
var array name = [element 1, Element 2, ...,]
B. Declarative methods
Using the Array object
var arr = new Array ();
Third, iterating through the array
Iv. Handling of arrays
Concat method
Join method
Pop method
Push method
Reverse method
Shift method
Slice method
Sort method
Splice method
toLocaleString method
ToString method
Unshift method
ValueOf method

The

DOM
transforms the elements in HTML into objects, and the HTML document is manipulated using JS to turn the HTML document structure into an object
A. Action Properties
B. Action Content
InnerText: (ie compatible) all in the form of text to put the content in ( The label will be treated as text, and when the text is fetched (not tagged) textcontent: (Other browser (FF))
InnerHTML: The tag will be identified and parsed when it is put in, and the label will be removed when it is taken out
Outertext:
Onterhtml: When taken out, the external tags are taken out together
to remove the contents of the response element from the form: Object.value;
Note: Use document.all to differentiate between IE and other browsers
C. Operation style
Object.style.backgroundColor = "Red";
"-" remove, capitalize the first letter of the following word
Bulk operations: Object.claaname = class selector name
turns into two forms of an Object
1. Name (multiple), ID (unique), names (multiple)
Three methods in document:
var objs=document.getelementsbytagname ("tag name");
var Objs=document.getelementbyid ("id name");
var objs=document.getelementsbyname ("name name");
2. By array


-----------------------------------------------------------------------------------------------------------
In a document flow
1. Create a Node
var obj = document.createelement ("tag name");
2. Adding to the document flow
A. Adding inside the specified element body
Obj.appendchild ("Dynamically created nodes");
B. Before the specified element (newobj)
Parentobj.insertbefore (obj, newobj);
C. After the specified element (write your own method)
function InsertAfter (obj, newobj) {
if (obj.nextsibling.nodetype==1) {
One.insertbefore (newobj, obj.nextsibling);
} else {
One.appendchild (newobj);
}
}
3. Delete Nodes
RemoveChild (One.lastchild);

-----------------------------------------------------------------------------------------------------------

Event handling
Event Source: Any HTML element (node) Body div button p a
II. Events: operation of the user
Mouse:
Click the
DblClick Double-click
ContextMenu Text Menu
MouseOver down.
Mouseout leave
MouseDown Press the
MouseUp Lift Up
MouseMove Mobile
Keyboard:
KeyPress keyboard Events
KeyUp Lift Up
KeyDown Press the
Document:
Load load (event triggered after page load is finished)
Unload off
Beforeunloa before closing
Form:
Focus Spotlight
Blur loses focus
Submit Submission Event
Change changes
Other
Scroll scrolling Events

Iii. Handling of events
Three different ways
The first type:
Format: <tag on event = "event handler"/>
The second type:
<script>
object. onclick = function () {}
</script>
The third type:
<script for = "Event Source id" event = "Event" > event handler </script>

----------------------------------------------------------------------

Event Object
Window
Document
location//page Jump
<mate http-equiv = "Refresh" content = "3" >
<mate http-equiv = "Refresh" content = "3;url=http://www.baidu.com" >//skip three seconds to Baidu homepage
Header ("Location:login.php");

Window.navigate (' url ');
location.href= ' URL ';
Location.replace (' url ');
To keep in mind:
Location = ' URL ';
Location.reload (TRUE);
History
History.back ();
History.go (-2);
Screen


About the properties of a location
Style.top
Style.left

Block Height:
Offsetwidth
Offsetheight

The distance from the Offsetleft block to the left object
OffsetTop

ScrollHeight
ScrollWidth
ScrollTop
ScrollLeft

JS Learning Notes

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.