CSS and JS notes

What is CSS and why use CSS.
CSS is the abbreviation for cascading Style Sheet. Translated "cascading style sheets".
is a markup language for (enhanced) Control of Web page styles and allows the separation of style information from Web page content.

HTML can only do basic page display, and we want to make the page beautiful, we have to decorate the page through CSS.

Example: A sentence is displayed on the page.
Intelligence Podcast.

How to use CSS
The combination of 1.html and CSS.
1. All HTML tags have a style property. This attribute is used to define the CSS
<span style= "font-size:10cm" > Intelligence podcast </span>
Only one label can be decorated in this way.
2. Use the <style> tag to declare our CSS
It is generally declared in the header by the <style> tag.

<style type= "Text/css" >
span,div{
font-size:2cm;
}
</style>
For all elements on the current page.
3. You can define a single style sheet (just a. css file)
You can import this CSS file directly on our page if you want to use it.

<link href= "Css/3.css" type= "Text/css" rel= "stylesheet" >
------------------------------------------------------------------
2.css Selector. Focus
Used to determine which tags are being decorated by the current CSS.
The most basic selector has three kinds.
The 1.ID selector using the # ID value should be unique.
2.class Selector
3. Tag Selector


The tag Selector---for our HTML tag, which allows you to uniformly manipulate labels of the same name.

The ID selector----An element that matches the value of the tag's ID, which is typically a personalized operation.

The class selector---it matches the value of the class attribute.

About style sheet writing.
Property name: value;
If the attribute has more than one value, the value is separated from the value with a space.

If this is the last value, the semicolon can be omitted.

-----------------------------------------------------------
CSS Filter Selector
Association Selector
Having a hierarchical relationship.
E1 E2 represents all the E2 under E1.
Sub-object selectors
E1 > E2 represents the E1 under the sub-E2
Combo Selector
tags with the same attributes, can be used, split open use.
Pseudo element Selector
A:link hyperlink is not clicked.
The state after the a:visited is visited.
A:hover the cursor to the status on the hyperlink (not clicked).
A:active the status when the hyperlink is clicked.

Property selector:
e[Property Name = property value]

For example, Java is a _____ language.
----------------------------------------------------------------------------
JavaScript introduction
The official name is called ECMASCRIPT.

JavaScript is designed to add interactive behavior to HTML pages
Without compiling, it can be interpreted directly by the browser to run-----JavaScript is an interpreted language.
JavaScript is a weakly typed language
The type is not fixed and can be changed arbitrarily. Also, there is no keyword int string, such as the declaring type in Java.
Declaring a type in JS uses var.

JS is an object-based language.

Three components of JS
1. Basic------ECMAScript Core
2.BOM Browser Object Model
3.DOM Document Object Model

---------------------------------------------------------------------------
Javascript
How to write the JS code in the HTML page.
The first way is not used
We can write our JS directly on the label.
<input type= "button" onclick= "Javascript:alert (' Hello ')" >
The second type (commonly used in learning)
Import via <script> tags on the page
It can exist anywhere on the page
Commonly used in the
<script type= the "Text/javascript" > Type property identifies the JavaScript language in our <script>.

Earlier there was an attribute language= "JavaScript" which was not used now.


Scripting languages----Other languages that are embedded in HTML. Js

The third Way (commonly used in development)
The way to import.
<script type= "Text/javascript" src= "1.js" ></script>
Note: The JavaScript file suffix name must be JS
src= "JS file path" in Import mode

Then in the <script> tag can not write the JS code

1.javascript data type.
Data type of JS
The data types in 1.js are divided into two kinds
1. Original type (Basic)
2. Reference types

JS declares a variable using var.

About the original type in JS.
Divided into 5 types: number, String, Boolean, null, undefined

1.number----Digital
2.string---Strings use quotation marks to enclose a single quotation mark, which is the same as a double quote, representing a string.
3.boolean---Logical type true false
4.null------represents a null typically used to assign a default value to a reference type
5.undefined---Undefined when we use variables, this variable is used without a declaration.

2. The type of data can be viewed via typeof

3. The data type of the variable can be judged by instanceof.
Instanceof is used to determine the reference type.

var a=new number (10);
Alert (a instanceof number); True

And this way
var i=10;
Alert (i instanceof number); False

2. About the writing standard in JS

In writing JS, you can not write ";",
Then JS will be a newline as the end of a statement.

To avoid some problems. We'll add a semicolon to the end of each statement, forcing the statement to end.

3. About debug use in Firefox.

Firebug Its main role has three
1. Debugging elements on the page
2. Can be used to capture the package operation (later use)
3. Can debug our JS code
-----------------------------------------------------------------------------------
About the operator expression in JS. Process Control statements.

1. About operators.
1. Arithmetic operators
+-*/% + +-these operations are the same as Java.

For JS, if two strings do-or */operate, the values are also manipulated as number.

2. Comparison operators
> >= < <= = = =!

= = Compare values only
= = = Compares the type to the value.

3. Logical operators
&& | | !
There is also a short circuit.
4. Ternary operators.
True? Value 1: value 2;----> value 1
False? value 1: value 2;----> value 2

2. Process Control Statements
If If.. else if ElseIf.
while ()
for ()

Questions about conditional expression results in JS?
if (true) {}

A summary of the values in the IF condition can be written.
1.true/false
2.0 1 0 represents false 1 for true.
3. If there is a return true if present, returns false if it does not exist.


----------------------------------------------------------------------------------
About the object in JS
The 1.String object represents a string.
Properties: Seeking string length

Method:
1.charAt to get the characters in the corresponding position according to the index
2.concat link string equivalent to +
3.indexof gets the position of the first occurrence of the specified character
4.match------
5.replace----
6.seach-------
7.split----delimited characters are delimited as string arrays in the specified manner
8.SUBSTR starts at the specified position and intercepts the specified number of characters
9.substring starts at the specified position and ends at the specified position. Does not contain the end.

The array object in 2.Array JS.
How to create an array in JS.
The array in JS is equivalent to the Java collection.

How to create an array in JS.
1.new Array ();
2.new Array (10);
3.new Array ("abc", "Def", "KKK")
4.[]

The method for the array.
Reverse gets a new array, which is the reverse of the original array.
Sort an array
The element in the join link array.
Concat Merging arrays
Shift ()----pop ()
Unshift ()--push ()

3.Math About mathematical operations

1.ceil gets the smallest integer larger than this number
2.floor gets the largest integer smaller than this number.
3.random gets a random number between 0-1 and does not pack 1.
3.round rounding
4.pow (m,n) for the n-th square of M
5.sqrt (m) m open square
6.max min

------------------------------------------------------------------
4.Date
The time-Date object in JS.

Date
1.new date () Gets the current time
2.getFullYear () Get year
3.getMonth () Get month note January results for 0
4.getHours () hours
5.getDate () Date
6.getMinutes () min
7.getSeconds () Get seconds
8.getTime () Gets the millisecond value.

9.toLocalString () Gets the local time format string.

----------------------------------------------------------------------------
5. Regular
Regexp
1. About the positive wording in JS.

1.new RegExp ("Regular expression"); ---This approach is not commonly used in development.

2. Directly use//to describe the regular expression.----use more in development
Example: Var reg=/\d*/

2. Application of the regular

1. Methods provided in the regular
1.exec (infrequently used in development) retrieves the value specified in the string. Returns the found value and determines its location.
Returns the matching information if the mismatch returned is null.

2.test (development use) retrieves the value specified in the string. Returns TRUE or FALSE.

2. The string provides multiple methods to directly use the regular.

1.search retrieves the value that matches the regular expression.

2.match finds a match for one or more regular expressions.
This method is the same as the EXEC function in regular.

3.replace replaces the substring that matches the regular expression.
-----------------------------------------------
When to use regular in development: Do data validation.

-------------------------------------------------------------------------------
Functions in JavaScript
What is a function? Why use a function?
The function, like the method, is to complete a specific function code block.

function can improve the reusability of the program. It is possible to invoke the function completion function in a specific case instead of a page load.

How to define a function in JS:
1.function function name () {}
2.var function name =function () {}
3.var Function name =new function ();

First Kind
function Show1 () {
Alert ("Show 1");
};

Show1 (); Calling functions

The second Kind
var show2=function () {

Alert ("Show 2");
};
Show2 ();

Third Kind

var show3=new Function ("Alert (' Show 3 ')");

SHOW3 ();
----------------------------------------------------------------
About the return value of the function in JS and the parameter problem.

1. Parameter issues
1. When the parameter is defined, write the variable directly, there is no type.
2. The parameter may not match the number when it is passed.

2. Questions about return values.
In JS if you want to have a return value after the method executes, you do not need to declare the return type and return directly in the function.

------------------------------------------------------------------------------------------------------
The global function in JS.
1. About the encoding function.

Generally in development we often encode and decode URLs.

Http://www.baidu.com?name= Zhang San

Url:http://www.baidu.com
Parameters:? name= Zhang San

Encodeuri/decodeuri codec URI---to manipulate URLs
encodeURI can be used as a whole when making URL jumps
encodeURI does not encode 82 characters:!,#,$,&, ', (,), *,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,a-z


Encodeuricomponent/decodeuricomponent codec URI component----operation of parameters
You need to use encodeURIComponent when passing parameters

encodeURIComponent does not encode 71 characters:!, ', (,), *,-,.,_,~,0-9,a-z,a-z



Escape/unescape Unicode encoding of strings---this is not commonly used in development.
Escape does not encode characters with 69: *,+,-,.,/,@,_,0-9,a-z,a-z


2. About type conversion functions.
parseint parsefloat

3. About whether the judgment is a numeric function.
Determines whether the number is IsNaN if the number returns false, not return true.

4.eval () function.
It parses the string directly into the JS code.
-----------------------
string conversion codes in Java

String s= "China"; Utf-8----Encoding

Byte[] B=s.getbytes ("Utf-8");

When it is passed, it is decoded as utf-8.

New String (b, "Utf-8");

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

CSS and JS notes