This is the 24th day of my participation in the August More Text Challenge
☆☆ Today’s learning content: (front-end communication – Ajax principle/cache/interface)! Check the gaps! Do do do
Can serve as a beginner’s learning route, can refer to, learning progress is not particularly driven! Ongoing update Combined with their own understanding, simple and comprehensive summary of the basic knowledge points in the process of learning JavaScript in vernacular Chinese, easy to deepen understanding!
Let’s get started! ‘Only a firm foundation can build a tall building ‘! Come on! Take it seriously!
1, comb yesterday’s knowledge
php
operationmysql
Steps:
- 1. Select the data source
- 2. Set up the database
- 3. Determine the character encoding
- 4. Write SQL statements
- 5. Run the SQL statement mysql_query
insert
delete
update
2, ajax
What is Ajax?
Asynchronous Async JavaScript and XML can be implemented using Ajax when submitting small amounts of data to the server
Improve the efficiency of program execution
Function:
The biggest feature of Ajax – no page refresh
Ajax usage scenarios:
- Verify the uniqueness of the user name
- Intelligent association of search box
- .
3. How Ajax works
As shown on the cover:
4. Asynchronous and synchronous
2. Simultaneous execution (synchronization in life).
Asynchronous – non-blocking mode does not affect subsequent code execution
Synchronization: Sequential execution
Synchronous – blocking mode in front of the code affects the following code execution
Ajax steps to get or send data to the server
Here’s an example:
Make a phone call:
- Need a cell phone
- 2, dial (establish and signal source connection)
- 3. The caller said
- 4. The other person responds
Ajax specific steps:
1. You need an Ajax objectXMLHttpRequest
var ajax = null
if (window.XMLHttpRequest) {
ajax = new XMLHttpRequest()
} else {
ajax = new ActiveXObject('Microsoft.XMLHTTP')}Copy the code
2. Establish a connection with the server
Through the open() method
Three parameters:
-
The first parameter: the way data is requested get/ POST
-
Get and POST:
-
Get The amount of data to be transmitted is small
-
The amount of non-path-transmitted data in POST is large
-
-
-
The second parameter: the path URL
-
Third argument: synchronous true/asynchronous false Default is asynchronous (can be omitted)
3. Send data
Send data through the send() method
4. The server processes the data and returns the results
The result of the server’s processing is in the responseText property
The result of the corresponding server processing via the onReadyStatechange event
Note in event: status value and status code judgment
Status values: 0, 1, 2, 3, 4
6, caching,
When you make multiple Ajax requests to the server for data, subsequent requests will pull the data from the browser’s cache if the requested path has not changed
If the server data changes, the client cannot obtain the browser data in a timely manner
To prevent caching:
A parameter value is a random value
"t"+(i+1)+".txt? Id = "+ new Date (). GetTime () or Math. The random ()
Character and object conversion
The data retrieved from the server via Ajax is all strings
Parse () convert string to object ‘{}’ ‘[]’ json.parse ()
Turn the object into a string json.stringify ()
8, interfaces,
- An interface is a back-end program that provides a path to the front end
- Interface path:
xxx.php
xxx.jsp
xxx.asp
Verify the uniqueness of the user name - Interface parameter: User name
username
- Interface return value:
- 0 The user name does not exist
- 1 The username exists
Preview: Come on, dream chasers
Learning is a continuous process, stick to it, there will be harvest!
Accumulate over a long period, consolidate the foundation, early into Dachang!
It’s not easy to keep it up, and it’s not easy to keep it up. You’re great!
Calm Down & Carry On!
Read more:
Review of previous updates
【 relearn JS】 Every day to strengthen the foundation of the series of articles:
Day23 – The front end also need to understand some databases,
【day1】
Day2 operators, DAY3 data types,
Day4 loop structure & Conditional statement, DAY5 function (emphasis), day6 scope & event,
【 DAY7 】 object & array method summary, 【day8】 string method & partial sorting,
【 DAY9 】Math object & Wrapper Function, 【 DAY10 】BOM- Browser object model,
【 DAY11 】DOM- Document Object Model
【 DAY13 】Event Event object first known (2),
【 DAY14 】 Event delegate & Drag principle
【 DAY15 】 Drag-and-drop implementation & regular introduction, 【 DAY16 】 regular specific method,
【 DAY17 】cookie, 【day18】ES6,
[DAY19] Js motion function encapsulation
[DAY21] Study and review in the first three weeks
[DAY22] Server and client
More on the way… A long way to go ==-.. – = =