Home > Developer > Web Develop
"Basic structure and syntax of HTML documents"
"Basic Structure":
<HTML> HTML file Start
<HEAD> header of HTML file starts
<title> title of the page </title>
......
...... Header content of HTML file
</HEAD> header end of HTML file
<BODY> the body of the HTML file begins
......
...... The main content of the HTML file
</BODY> end of the body of the HTML file
</HTML> End of HTML file
|
"Grammar" __ "Text Elements":
<p>this is a paragraph</p>
<br> (line break)
The <pre>this text is preformatted</pre>pre element defines the pre-formatted text. Text that is enclosed in the pre element usually retains spaces and line breaks. The text is also rendered as an equal-width font.
__________ "Logical Styles"
<em>this text is emphasized</em> (italic accent)
<strong>this text is strong</strong> (bold emphasis)
<code>this is some computer code</code> (indicates the computer source code or other machine readable text content)
__________ "Physical Styles"
<b>this text is bold</b> (bold)
<i>this text is italic</i> (italic)
__________ "Links, anchors, and Image Elements"
<a href= "http://www.example.com/" >this is a link</a>
<a href= "http://www.example.com/" ></a>
<a href= "Mailto:[email protected]" >send e-mail</a>
<a name= "Tips" >useful tips section</a>
<a href= "#tips" >jump to the useful tips section</a>
__________ "Unordered List"//unordered lists
<ul>
<li>first item</li>
<li>next item</li>
</ul>
__________ "Ordered List"
<ol start= "Ten" >
<li>first item</li>
<li>next item</li>
</ol>
__________ "Definition list"//Definition Table
<dl>
<dt>first term</dt>
<dd>Definition</dd>
<dt>next term</dt>
<dd>Definition</dd>
</dl>
__________ "Tables"
<table border= "1" >
<tr>
<th>someheader</th>//<th> defines the header cells within the table.
<th>someheader</th>
</tr>
<tr>
<td>sometext</td>
<td>sometext</td>
</tr>
</table>
__________ "Frames"
<frameset cols= "25%,75%" >//Percent setting width
<frame src= "Page1.htm" >
<frame src= "Page2.htm" >
</frameset>
__________ "Forms"
<form action= "http://www.example.com/test.asp" method= "Post/get" >
<input type= "text" name= "LastName" value= "Nixon" size= "" "Maxlength=" >
<input type= "Password" >
<input type= "checkbox" checked= "Checked" >
<input type= "Radio" checked= "checked" >
<input type= "Submit" >
<input type= "Reset" >
<input type= "hidden" >
<select>
<option>apples
<option Selected>bananas
<option>cherries
</select>
<textarea name= "Comment" rows= "ten" cols= "></textarea>"
__________ "entities"//entity
< is the same as <
> is the same as >
© & #169; Is the same as? Copyright
& is the same as &
"is the same as "
? Registered trademarks ® & #174;
? Trademark (US)? & #8482;
X Multiplication Sign × & #215;
÷ Division sign ÷ & #247;
__________ "Other Elements"
<!--This is a comment-
<blockquote>//Defining block references
Text quoted from some source.
</blockquote>
<address>//Define contact information for the author/owner of the document or article
Address 1<br>
Address 2<br>
City<br>
</address>
"HTML forms and common Controls"
"Forms": HTML forms are used to collect different types of user input.
"Common Controls":
<input type= "text"/> text input box <br/>
<input type= "Submit" value= "commit button"/><br/>
<input type= "reset" value= "reset button"/><br/>
<input type= "Radio"/> radio button <br/>
<input type= "password"/> password input box <br/>
<input type= "image"/> image <br/>
<input type= "hidden"/> hidden fields <br/>
<input type= "file"/> Files submitted <br/>
<input type= "checkbox"/> check box <br/>
<input type= "button"/> Normal button <br/>
<select>
<option> SELECT list </option>
<optgroup><option> drop-Down submenu </option></optgroup>
</select>
<textarea> Text Area </textarea>
<label> Tags </label>
<fieldset> Group </fieldset>
<legend> description element, required information </legend>
"The basic concept and role of CSS"
|
"Concept": CSS (cascading style Sheet) is a cascading style sheet, a set of formatting rules that controls the appearance (style) of Web page content and allows a markup language that separates the style information from the content of the Web page. The relationship between HTML and CSS is the relationship between "Web page structure" and "expressive form".
"Role": for the definition of style in Web pages, to solve the problem of separation of content and performance.
"Basic syntax and basic usage of CSS"
Basic syntax: A CSS rule consists of two main parts: a selector, and one or more declarations.
|selector{declaration1, Declaration2, Declarationn}
| Each declaration consists of a property and a value, and each property has a value. Attributes and values are separated by colons.
|selector {Property:value}
"Basic Use Method":
Inline style: Use the Style property directly on the markup of the HTML and write the CSS code directly in it.
<p style= "Color:sienna; margin-left:20px ">this is a paragraph</p>
Internal style sheet: writes CSS between <style> and </style>.
<style type= "Text/css" >
hr {Color:sienna;}
p {margin-left:20px;}
Body {background-image:url ("Images/back40.gif");}
</style>
External style sheet:<link rel= "stylesheet" type= "Text/css" href= "Mystyle.css"/>
"Hierarchy of CSS and its effect precedence": style sheets are prioritized from high to low: inline style sheets (inline style sheets) > internal style Sheets > external style Sheets
Supplemental rule: In the case of the same priority, the later defined property overrides the previously defined.
The rules labeled "!important" have the highest priority
"The basic concept and role of JavaScript"
"Basic Concept": JavaScript is a literal-translation scripting language, a dynamic type, a weak type, a prototype-based language, and a built-in support type.
"Action": used primarily to add interactive behavior to an HTML page.
Basic syntax for JavaScript
""
1. Case-sensitive: variable names, function names, operators, and everything else are case-sensitive.
2. The variable is of weak type (VAR). A weak type refers to a weakly typed variable that can be given any type of value.
3. The semicolon at the end of each line is optional.
4. Comments: Single-line comment//Multiline comment/**/
5. Brackets represent code blocks: {}
6. Variable definition: Use the var keyword to declare. The naming conventions for variables are: alphanumeric, $ and underscore, but cannot start with a number. The variable name cannot be used with the keyword.
7.JavaScript data type:
undefined type
Null type (Object)
Boolean type
Number type (int integer float float)
Octal and hexadecimal 012< br> floating point
Special number value
String type
Funciton--function type
object reference type.
8. Type conversions:
Use: Number (), parseint (), and parsefloat () to convert
numbers () to a numeric value (containing integers and floating-point numbers).
*parseint () strong-to-integer,
*parsefloat () strong-floating-point number
Function isNaN () detects if the parameter is not a number. The 3 coercion type conversions that are available in a number
ECMAScript are:
Boolean (value)-converts the given value to a Boolean type;
Number (value)-converts the given value to A number (which can be an integer or floating point);
String (value)-converts the given value to a string;
"JavaScript common built-in objects"
|
The JavaScript built-in objects are listed in the following categories.
String object: Handles all string operations
Math object: Handling all mathematical operations
Date object: Handling the storage, conversion, and expression of dates and times
Array object: Provides a model of an array, storing large amounts of ordered data
Event object: Provides various processing information for JavaScript events
Built-in objects have their own methods and properties and are accessed in the following ways:
Object name. Property name
Object name. Method name (parameter table)
"Basic concept and role of the browser object model BOM"
|
"Basic Concept": a BOM (Browser object mode) is a model of the browser objects that describes the hierarchical relationship between objects and objects, and the browser object model provides a content-independent object structure that can interact with the browser window. A BOM consists of multiple objects, which represent the window object of the browser windows as the top-level object of the BOM, and the other objects are child objects of that object.
|
"Effect":
1. Pop up the new browser window, move, close the browser window and resize the window;
2. A navigation object that provides detailed information about the Web browser;
3. Locate objects that provide detailed information about the pages loaded into the browser;
4. Screen object that provides user screen resolution details;
5. Support for cookies.
"Basic concepts and role of the Document Object model Dom"
"Basic Concepts": The DOM is the abbreviation for the Document object module, which is the documentation objects model. The DOM is an application interface (API) that represents documents and accesses and operates the various elements that make up the document, and all JavaScript-enabled Web browsers support the DOM.
|
"Action": the DOM renders elements and content within a Web page as a clear, readable tree model. Map the entire page to a multi-tiered node structure.
"Basic concepts of Internet and Web technologies"
Internet: The Internet is an open internetwork that is interconnected by many networks and computers located in different parts of the world and relies on the TCP/IP protocol for communication.
"Web Technology": World Wide Web (www or web)
The web is a world-wide, HTTP-based communication protocol that stores all of the interconnected hypertext sets in a Web server. It uses the customer/service computing model. The Web server hosts a variety of information organized with Web documents, and clients browse through the information resources through browser software such as IE or Netscape.
The Web is a collection of tens of millions of documents that are associated with each other in a computer that is stored on the Internet.
The web is actually a global resource system, and the Internet is its communication infrastructure.
Web server: A server that is based on an HTTP communication protocol is called a Web server. The Web server holds the Web document.
Web document: A Web server holds a variety of information, such as a Web document, that is organized in an HTML language.
"The main component of Web technology"
⑴ Hypertext Transfer Protocol (HTTP, Hyper-text Transfer Protocol)
⑵ Unified Resource Locator address (URL, Uniform Resource Locator)
⑶ Hypertext Markup Language (HTML)
⑷web Server
⑸web Browser
"Basic concepts and working principles of Web browsers and servers"
Web browser: A software tool used to obtain and display Web pages through a URL.
Web server: A server that is based on an HTTP communication protocol is called a Web server. The Web server holds the Web document.
"How It Works":
(1) User request (URL address)
(2) Find information resource address according to user request
(3) Application Server performs a query operation on the database
(4) Query results returned to Application server
(5) Application Server embeds data into page
(6) The Web server sends the completion page to the browser
(7) browser displays search results for users
____
| customer | __________ ___________ ________
| user | ==> (1) ==> | | ==> (2) ==> | | ==> (3) ==> | |
End | | | | | | |
(7) | | |internet| | Web server | | database |
| overview | <== (6) <== | | <== (5) <== | | <== (4) <== | |
| |________| |_________| |______|
|__|
"Web application Development architecture and development Technology"
The Web application framework (Web application framework) is a computer software framework designed to support the development of dynamic Web sites, Web applications, and Web services. This framework helps to reduce the workload of common activities in web development, such as providing database access interfaces, standard templates, and session management for many frameworks, which can improve the reuse of code.
Category: MVC framework (Model-View-Controller) MVC (Models View Controller)
Three-part organizational model
Content Management System (CMS)
Model-View-controller (MVC (Model View Controller))
Many frameworks follow the structural pattern of the model-view-controller (MVC) architecture model, separating the data model from the user interface. This is generally considered a good practice because of its modular code, which can improve the reuse of code and allow multiple interfaces. In Web applications, this allows for different aspects of the application, such as Web pages, remote applications, and Web Service interfaces. MVC is the industry's more recognized architectural model.
Three-part organizational model
In this organization model, applications are created in three parts: clients, applications, and databases. A database is typically an RDBMS. Instead, the client refers to the HTML generated by the Web application and runs in the user's browser. The application runs on the server.
Content Management System (CMS)
Refers to a content editing program. As in the blog writing articles, do not need to know the programming of people, can also be published through the CMS, change, management content.
"Development Technology":
"Client Technology": HTML, CSS, DOM, JavaScript, Ajax, and more.
"Server-side Technology": CGI, ASP, PHP, ASP. NET and JSP.
"Basic concepts and principles of Java Servlet and JSP"
Java servlet: A Java servlet is a Java component dedicated to writing Web server applications. All Java-based server-side programming is built on the servlet. The servlet is already a standard component in the Java EE.
"ASP. NET basic concepts and principles "
Concept
Asp. NET is a new generation of dynamic Web application development platform introduced by Microsoft Corporation, and it is an innovative technology to build Dynamic Web application. Asp. NET is part of the. NET Framework, and you can use any. NET-compatible language, such as Visual Basic, C #, to write your ASP.
Asp. NET is a part of Microsoft.NET, another version of active Server Page (ASP), and ASP. Web provides a single, unified model for developing the various services that developers need to build enterprise-level Web applications. Asp. NET syntax is largely compatible with ASP, and it also provides a new programming model and structure that generates applications that are more scalable and stable, and provides better security protection.
Asp. NET is a compiled, based. NET environment, can be used with any. NET-compatible languages, including Visual Basic.NET, C #, and JScript. NET) Authoring applications. In addition, the entire. NET Framework can be used by any ASP. Developers can easily get the benefits of these technologies, including managed common language runtime environments, type safety, inheritance, and so on.
Principle
Asp. NET works: in ASP., after an HTTP request is sent to the server and received by IIS, IIS first loads the appropriate. dll file for it through the page type requested by the client and then sends the request to the module that can handle the request during processing. In ASP. NET, this module is called the HttpHandler (HTTP handler component), the reason why the. aspx file can be processed by the server is because the server side has a default HttpHandler dedicated to processing. aspx files. Before the IIS sends this request to the module capable of processing the request, there is some httpmodule processing, which is the system default modules (to get the collection of modules for the current application), before the HTTP request is passed to HttpHandler. To undergo a different httpmodule treatment.
"Basic PHP Concepts and principles"
"Concept": PHP (Foreign name: Hypertext Preprocessor, Chinese name: "Hypertext Preprocessor") is a common open source scripting language. Grammar absorbs the features of C, Java and Perl, is easy to learn and widely used, and is mainly applicable to web development.
"principle": All PHP applications are performed through a Web server (such as IIS or Apache) and a PHP engine program that interprets the execution of the process: (1) When the user enters the file name of the PHP page to be accessed in the browser address, then the ENTER will trigger the PHP request, and transfer the request to a Web server that supports PHP. (2) The Web server accepts this request and makes a decision based on the suffix if it is a PHP request, the Web server pulls the PHP application that the user wants to access from the hard disk or memory and sends it to the PHP engine program. (3) The PHP engine will scan files from the Web server and read from the background, process the data, and dynamically generate the corresponding HTML page. (4) The PHP engine returns the generated HTML page to the Web server. The Web server then returns the HTML page to the client browser.
"Basic concepts and principles of Ajax"
"Concept": Ajax is "asynchronous JavaScript and Xml[1]" (Asynchronous JavaScript and xml[1), which is a web development technique for creating interactive Web applications.
AJAX = Asynchronous JavaScript and XML (a subset of standard generic markup languages).
AJAX is a technique for creating fast, Dynamic Web pages.
AJAX enables Web pages to be updated asynchronously by exchanging small amounts of data in the background with the server. This means that you can update a part of a webpage without reloading the entire page.
Traditional Web pages (without AJAX) if you need to update your content, you must reload the entire page surface.
"Principle": Ajax works by adding a middle layer between the user and the server, making the user operation and the server response asynchronous. In this way, some of the previous workload of the server is passed on to the client, which is advantageous to the client's idle processing ability to deal with, reduce the burden of server and bandwidth, so as to save ISP's space and bandwidth leasing cost.
The core of Ajax is the JavaScript object XMLHttpRequest. This object was first introduced in Internet Explorer 5, which is a technique that supports asynchronous requests. In short, XMLHttpRequest allows you to use JavaScript to make requests to the server and handle the response without blocking the user.
Ajax is the aggregation of many kinds of technologies. which includes the browser's XMLHttpRequest object, he is responsible for you to open another connection channel, can pass information. JavaScript: He is the medium responsible for invoking the XMLHttpRequest object for interacting with the background. XML is a data format used by the server to respond to the format of passing information. In addition to XML, you can use any text format, including Text,html,json, and so on.
Web front-End Basics!
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
