Home > Developer > Web Develop

DHTML (Dynamic HTML) front page technical Introduction

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

First, DHTML(Dynamic HTML ) front Page technical Introduction

1. DHTML Introduction

DHTML contains four areas of content:

(1),HTML 4.0 : Hypertext Markup Language, the main body of the Web document, stored as a text file, translated by the browser to show a variety of pages.

(2), Cssl: client-side scripting language, mainly vbscript (VBS) jscript netscape main support Span style= "Font-family:times New Roman" >js ie main support js vbs jscript

3 ), dom : Document Object model, w3c promotion web One of the technical standards, which abstracts the contents of a Web page into objects, each object has its own properties (Properties) , method cssl

(4),CSS: Cascading style forms, a markup language that controls the style of a Web page and allows the separation of style information from web content to compensate for HTML The limitations on typography are the result of deficiencies, which are part of the DOM . CSS properties can be changed dynamically by Cssl to change the visual effect of the page.

2,   css

CSS web The appearance of the page. Format the page by using the css style settings You can separate the contents of a page from its presentation. The contents of the page are stored in the html document, The css html A portion of a document, usually the header part of a file. Separating content from presentation not only makes it easier to maintain the appearance of the site, but also enables html document code more concise, shorten the browser load time.

In a Web page can be divided into external css style sheets, inline CSS style sheets and internal CSS style sheets.

（1), externalCSSstyle sheet(External Styles Sheet)mode, it is through a separateCSSstyle sheet text file(the extension is typicallyCSS)Control OtherWebpage, that is, whenever you want to specify a styleWebpage, set a link to theCSSstyle sheet file, and then just change thisCSSstyle sheet content, you can change all links to theCSSof the style sheetWebpage style.

(2), inline CSS style sheet (Embedded styles Sheet) mode, which is directly in the HTML the Body > Before the label is set, this setting directly affects the Web the style settings for the page.

( 3 css style sheet (Internal styles sheet) html ( " style settings. css web page style settings.

3. JavaScript Introduction

The most commonly used client-side scripting language for implementing business logic and developing interactive Web pages in the browser and interpreting execution at the browsing end.

Like css stylesheets , JavaScript is also divided into external js, page js and tag inline JS .

Here, you make a separate description.

4. a complete HTML file Description

<meta http-equiv= "Content-type" content= "text/html; CHARSET=GBK" > <! - META tags can only be placed in the head tag to communicate hidden information about the document to the server and client--! >

<link href= "css.css" type= "text/css " rel= "stylesheet" > <!--referencing external CSS style sheet files-- !>

<script type= "Text/javascript" src= "Test.js" ></script> <!--referencing external JS files--! >

<style type= "Text/css" > <!-- inline CSS style --! >

. table1{

Color: #ff0000;

width:500px;

height:200px;

}

</style>

<title> my title </title>

<script language= "JavaScript" > <! - embedded JavaScript program--! >

Function ABC (value) {

alert (value);

}

</script>

<body> <!-- Document Body start --! >

<center>

< Form name= " form1 post abc.jsp >

<table class= "table1" border= "2" id= "TB" >

<tr>

<TD width= "50%" >1111</td>

<TD width= "50%" >1111</td>

</tr>

<tr>

<TD width= "50%" >2222</td>

<TD width= "50%" >2222</td>

</tr>

</table>

<input type= "button" class= "Button1" onclick= "ABC (this.value)" value= "OK" >

<input type= "button" style= "Background-color: #0000ff; color: #ff0000; width:150px" onclick= "Test ()" value= "Change Table Properties" >

</form>

</center>

</body>

5. HTML,CSS,DOM , and JavaScript the relationship between four people

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

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

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

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

    Open a Ticket

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

    Learn More