HTML & JavaScript
q 有三種類型的鏈接路徑：
q 絕對路徑（例如 http://www.sohu.com/index.html）
q 文檔相對路徑（例如 adver/contents.html）
q 站點根目錄相對路徑（例如 /support/app/customer.html，其中“/”表示根目錄）
常用的事件有：
onClick
onMouseDown
onMouseOut
onMouseOver
onReset
onSelect
onSubmit
onload
常用的動作有：
彈出信息
打開瀏覽器窗口
轉到 URL
驗證表單
META 標簽是一個特殊的 HTML 標簽，提供有關網頁的信息，如作者姓名、公司名稱和聯系信息等
http-equiv 屬性可用來代替 META 標簽中的 name 屬性
<P>…</P> 標簽用于標記段落
q 只要在文本中放入 <BR> 標簽，就會強制換行
<PRE> 標簽用于顯示具有預先定義格式的文本
<BODY>
<H1>星期中的每一天</H1>
<UL>
<LI>星期日
<LI>星期一
<LI>星期二
<LI>星期三
<LI>星期四
<LI>星期五
<LI>星期六
</UL>
</BODY>
無序列表也稱為“項目列表”
<BODY>
<H1>星期中的每一天</H1>
<OL>
<LI>星期日
<LI>星期一
<LI>星期二
<LI>星期三
<LI>星期四
<LI>星期五
<LI>星期六
</OL>
</BODY>
|
有序列表的屬性
|
|
<LI TYPE = I>
|
|
<LI TYPE = i>
|
|
<LI TYPE = A>
|
|
<LI TYPE = a>
|
|
<OL START = n>
|
在有序列表中，列表項以自動生成的順序顯示
|
特殊字符
|
字符實體
|
|
大于號 (>)
|
>
|
|
小于號 (<)
|
<
|
|
引號 (“)
|
"
|
|
®
|
®
|
|
©
|
©
|
|
& 號
|
&
|
q 錨記標簽用于使用戶“跳”到文檔的某個部分
q HTML 的 NAME 屬性用于創建錨標記
<A NAME = “marker”>主題名稱</A>
q 為達到這種跳轉效果，請在 HREF 參數中使用該標記
<A HREF= “#marker”>主題名稱</A>
Conclude
q HTML 標簽一般配對使用，不區分大小寫
q 標簽都具有屬性。屬性提供關于網頁上 HTML 元素的附加信息
q META 標簽放置在網頁的標題處以提供關于頁面的信息。搜索引擎常會用到這些標簽
q 標題級標簽使用<H1>…<H6>
q 段落標簽使用<P align＝“對齊方式”>…</P>
q 無序列表使用<UL>標簽,有序列表使用<OL>標簽
q 字體標簽<Font color=“顏色” size=“大小” face＝“字體”>
q 超鏈接標簽<A href=“鏈接地址”>超鏈接文本</A>
Chapter 5
<CAPTION>表示表格標題
<TH>表示行或列標題，粗體顯示
COLSPAN=“n” 屬性表示跨多少列
ROWSPAN=“n” 屬性表示跨多少行
<html>
<head>
<title>課堂練習1</title>
</head>
<body>
<table border=3 width=50%>
<caption align=top>課堂測試</caption>
<tr>
<td align=center>1</td><td align=center>2</td><td align=center>3</td>
</tr>
<tr>
<td align=center>4</td><td align=center>5</td><td rowspan=2 align=center>6</td>
</tr>
<tr>
<td colspan=2 align=center>7</td>
</tr>
</table>
</body>
</html>
<FORM action=“http://www.sohu.com” method=“post”>
action指定提交后由服務器上哪個處理程序處理
文本框、按鈕、單選按鈕、復選框等都是輸入元素。
<INPUT type=“?” name=“?” size=”?”
value=“?” maxlength=“?” checked=“?”>
|
Type
|
此屬性指定元素的類型。元素類型可以有多種選擇：TEXT、PASSWORD、CHECKBOX、RADIO、SUBMIT、RESET、FILE、HIDDEN 和 BUTTON。默認選擇為 TEXT。
|
|
Name
|
此屬性指定控件的名稱。例如，如果表單中有幾個文本框，則可以用名稱 TEXT1、TEXT2 或選擇的任何名稱來標識它們。Name 屬性的作用域是在 FORM 元素內。
|
|
Value
|
此屬性是可選屬性，它指定控件的初始值。但是，如果 TYPE 為 RADIO，則必須指定一個值。
|
|
Size
|
此屬性指定控件的初始寬度。如果 TYPE 為 TEXT 或 PASSWORD，則控件的大小以字符為單位。對于其他輸入類型，寬度以像素為單位。
|
|
Maxlength
|
此屬性用于指定可在 TEXT 或 PASSWORD 元素中輸入的最大字符數。
|
|
Checked
|
此屬性是 Boolean 屬性，指定按鈕是否是打開的。當輸入類型為 RADIO 或 CHECKBOX 時，使用此屬性。
|
<INPUT name="button1" type="submit" value="提交">
<INPUT name="button2" type="reset" value="重置">
<INPUT name="button3" type="button" value="普通按鈕">
*
身份證號<input type="Text" name="PID" value=""
size="20" maxlength="18">
密 碼： <INPUT type=password value=“” name=“pass" size=15>
<TEXTAREA name=“textarea” clos="20" rows="5" >請填寫您的工作經歷</TEXTAREA>
*
性別：<INPUT TYPE=radio NAME=”sex” VALUE=”male”>男性
<INPUT TYPE=radio NAME=”sex” VALUE=”male”>女性
你喜歡以下哪些明星：
<br>
<input type="Checkbox" name="id1" value="Noriko_Sagai">酒井法子
<input type="Checkbox" name="id2" value="Leon">鄭秀文
<input type="Checkbox" name="id3" value="BonJovi"
checked>BonJovi
*
<B>誰是 2002 年世界杯冠軍？</B>
<SELECT NAME =“myselect">
<OPTION SELECTED>西班牙</OPTION>
<OPTION>法國</OPTION>
<OPTION>巴西</OPTION>
<OPTION>德國</OPTION>
</SELECT>
*
<HTML>
<HEAD>
<TITLE>求職者</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=gb2312"> </HEAD>
<BODY bgcolor="#FFBFFF">
<P align="center"><FONT size="5">申請表</FONT>
<HR color="#FF9F00" >
<FORM ACTION="http://somesite.com/processform" METHOD="POST">
姓名：
<INPUT TYPE="TEXT" ID="firstname">
<P>感興趣的職位：
<P>
<INPUT TYPE=RADIO NAME="CONTROL1" VALUE="0" CHECKED>Web 設計人員
<INPUT TYPE=RADIO NAME="CONTROL1" VALUE="1" >Web 管理員
<INPUT TYPE=RADIO NAME="CONTROL1" VALUE="2" >Web 開發人員
<P>其他要求<BR>
<TEXTAREA NAME="CONTROL3" COLS="30" ROWS="5">包括薪水待遇、工作地點等。
</TEXTAREA>
<P><INPUT NAME="CONTROL4" TYPE=CHECKBOX CHECKED>發送確認信息
<BR>
經驗
<SELECT NAME="CONTROL2">
<OPTION>無經驗</OPTION>
<OPTION>1 年</OPTION>
<OPTION>3 年</OPTION>
<OPTION>5 年</OPTION>
</SELECT>
<P>
<INPUT name="提交" TYPE=submit VALUE=" 確 定 ">
<INPUT name="重置" TYPE=reset VALUE=" 重 置 ">
</FORM>
</BODY>
</HTML>
Conclude2
<TABLE width=“?” border=“?” align＝“？”>
<CAPTION> 表格標題</ CAPTION >
<TR bgcolor＝“？”>
<TH align=“?”>數據1 <TH>
<TH align=“?”>數據2 <TH>
…..
</TR>
<TR bgcolor＝“？” >
<TD align=“?”>數據11 </TD>
<TD align=“?”>數據22</TD>
</TR>
</TABLE>
*
<FORM action=“?” method=“?” >
文本框 <INPUT type＝“text” name＝“？” value＝“？”
maxlength=“？">
密碼框 <INPUT type＝“password” name＝“？” value＝“” >
文本域 <textarea name=“？” clos=“？” rows=“？”>
</textarea >
單選按鈕<INPUT TYPE=radio NAME=”？” VALUE=”？”>
男性
復選框<input type="Checkbox" name="？" value="？">
酒井法子
*
<SELECT NAME ="？">
<OPTION >選項1</OPTION>
<OPTION>選項2</OPTION>
<OPTION>...</OPTION>
</SELECT>
<INPUT type="Submit" value="提交" name="?">
<INPUT type="reset" value="重置" name="?">
</ FORM>