第 1 章 基础知识

小题，概念

1.1 Internet简介 2

1.1.2 Internet 的含义

TCP / IP Transfer Control Protocol / Internet Protocol

1.1.3 IP 地址
1.1.4 域名 domain name

Fully qualified domain name (unique) the host name and all of the domain names
host-name.domain-names db.cs.berkeley.edu
DNS Domain Name Servers
FTP File Transfer Protocol

1.2 万维网 WWW 4

1.2.2 web 还是 Internet（区别）

1.3 Web浏览器 6

1.4 Web服务器 7

WAMP？
1.4.1 web服务器操作 (primary task)
1.4.2服务器的一般特性 (two main directories)
补充：Web Server’s default port number is 80（HTTP 的默认端口号 80，HTTPS 是 443）

Document root servable documents
Document root is accessed indirectly by clients
Its actual location is set by the server configuration file.
Requests are mapped to the actual location.
Server root server system software

1.4.3 常见 Web 服务器：Apache
(Most in Linux, most widely used, .conf)
14.4 常见 Web 服务器：IIS
（Microsoft, for Windows, GUI）

1.5统—资源定定位符 9

URI = URN + URL
Uniform Resource Identifier 统一资源标识*
Uniform Resource Name 统一资源名称*
Uniform Resource Locators 统一资源定位（路径）

1.5.1URL的格式

{schema} : {object-address}
schema 通信协议如 http,file
object-address 当 schema = HTTP 时：
http: // fully-qualified-domain-name(见1.1.4) :8080 / path-to-document(见1.4.2)
HTTP 的默认端口号 80，此时可不写
常见端口号有：HTTPS443、SSH22、proxy8080(eg. Apache Tomcat
当 schema = file 时*：
file: // path-to-document(1.4.2)

1.5.2 URL路径

http://www.hello.com:80/files/f99/story.html compete path
if SERVER’s document-root => files/f99
http://www.hello.com:80/story.html partial path
http://www.hello.com:80/ search on top level of dir, defaultly file is usually named index.html.

1.7超文本传输协议 HTTP 12

两小节尾部都有详细示例

HTTP HyperText Transfer Protocol

1.7.1 请求阶段 HTTP Request


1. {HTTP_method} {URL} {HTTP_version}
1. Request Header fields
1. blank line (needed cause some header does not have messagebody)
1. Message body
1. 请求首行
{HTTP_method} {URL} {HTTP_version}		 For example:
GET /degrees.html HTTP/1.1
HTTP_method:
- Get - fetch a document
- Post - execute the document, using the data in body
- …
2. 头部字段
Request Header fields		 任意行数，根据浏览器接受能力定
For example:
- Accept: text/plain
- Accept: text/
- If-Modified-since: 2020.1.20
- (Host: hostname)
- (Content-length: byte, if with messagebody)*

1.7.2 响应阶段


1. Status line:{HTTP_version} {status_code} {explanation}
1. Response header fields
1. blank line (needed cause some header does not have Responsebody)
1. Response body
1. Status line
{HTTP_version} {status_code} {explanation}		 For example:
HTTP/1.1 200 OK
status_code begins with:
- 1 => Informational
- 2 => Success, eg. 200
- 3 => Redirection
- 4 => Client error, eg. 404 Not Found
- 客户端的URL有问题导致找不到，所以说是客户端错误
- 5 => Server error
2. 响应头部
Response header fields		 could contains several lines, the only essential field is Content-type! Example see ch.15 （中文版15页）
- Content-type: text/html, charset=UTF-8

1.9 the Web Programmer’s toolbox

1.9.1 HTML（client-side）
defined with SGML，Hypertext Markup Language 是标记语言(Markup Language)，描述文档格式和布局（细节）。非编程语言(Programming language)，不能描述计算。
1.9.4 XML （client-side）
SGML(Standard Generalized Markup Language)
—-simplize—> XML(eXtensible Markup Language)
vs HTML predifined tags, XML creates one’s own tags.可指定特定标签
1.9.5 JavaScript（most in client-side, server side supported）
脚本语言 (scripting language), dynamically type 动态/弱类型 vs Strongly typed language;
嵌入embedded in HTML 使成为动态文档，随 HTML 下载。
1.9.7 PHP （server-side）
脚本语言 动态/弱类型
嵌入embedded in HTML 使成为动态文档，不随 HTML 下载，在服务器就完成解释，结果插入 HTML 中。

第 2 章 HTML/XHTML 简介

2.2 基本语法 33

Browsers ignore comments注释, unrecognizable tags无法识别的标签, line breaks回车, multiple spaces多个空格, and tabs缩进. Tags are suggestions to the browser

2.3 HTML文档的标准结构 34

  1. <!DOCTYPE html><!-- SGML 文档类型定义 -->
  3. <html lang="en">
  5.     <header>
  7.         <title></title>
  9.         <meta charset="utf-8" /> 
  11.     </header>
  13.     <body>
  14.         <!-- main -->
  15.     </body>
  17. </html>

2.4 基本的文本标记 35

2.4.1 段落 <p></p>
外部 block 块级元素、内部无视换行和多空格（vs2.4.3）
2.4.2 换行 <br />
2.4.3 保留标签内部空白字符和换行 <pre></pre>
2.4.4 标题 <h6></h6>
block
2.4.5 文本块引用 <blockquote></blockquote>
block，相比 <p></p> 有双向缩进效果
2.4.6 字体样式与大小
inline 内联元素/行级标签
Bold - <b></b> <strong></strong>
Italics Emphasis - <i></i> <em></em>
x23 - x23
2.4.7 字符实体，特殊字符的转译 ch.41
2.4.8 水平线 <hr />
2.4.9 meta 元素的其他用法 <meta name="便于搜索引擎分类" content="描述" />

2.5 图片 <img /> 42

2.5.1 图片格式 GIF JPEG PNG
2.5.2 Web程序设计_目录 - 图1元素
<img src="" alt="" height="" width="" />
inline；长宽不用写单位，默认 px；可写百分比，根据显示器。

2.6 超链接 <a></a> 48

2.6.1 链接 <a href="new/index.html"> <img src="../hi.jpeg" /> </a>
2.6.2 位于文档内部的目标 <a href="new/index.html#id"> <a href="#id">
使用 # 指向 id。
2.6.3 使用链接

2.7 列表 51

2.7.1 无序列表
2.7.2 有序列表 52
2.7.3 定义列表 62

2.8 表格 55

2.8.1 基本的表格标签
2.8.2 rowspan 与colspan特性 => 合并单元格
2.8.3. 表格分块
2.8.4 表格的使用
使用表格的一般性布局（纯html定义）臃肿难读，将布局交给 css。

2.9 表单 60

2.9.1 form 元素 <form action="必填" method="默认get，可填post"></form>
form element
action - URL（相对路径或网址）
get/post 差异。
2.9.2 input元素
inline element, should be placed in block container such as

, not directly placed in form element!!!
<input type="必填" id="客户端区分" name="服务器区分,大部分必须" value="text默认值/选项提示" />

  • type=”text / password” ch.62
    • size=”默认20超出左侧消失”
    • maxlength=”超出右侧消失，强于size”
    • placeholder=”提示，弱于value”
  • type=”checkbox” ch.64 js 中定位见 5.3
  • type=”radio” ch.65
  • type= “url / email” ch.65
  • type=”range” min/max=”” ch.66

2.9.3 select 元素
inline，菜单，multiple=”multipe”多选
<select name="" size="每次展示，默认1"> <option></option> </select>
2.9.4 textarea元素 rows/cols 68
2.9.5 动作按钮 reset/submit 69
2.9.6 一个完整的表单示例 70

2.14 HTML 与 XHTML 之间的语法差异 77

html 标签属性为数值时可以不用引号、不区分大小写。。。

第 3 章 层叠样式表 CSS

Cascading Style Sheets

3.1简介 83

为什么用？第1段：精确设置！

3.2样式表的层次 84、3.3 样式说明格式 85

  1. inline <h1 style=";;;;;">
  2. document-level <style type="text/css"></style>

  3. external <link rel="stylesheet" type="text/css" href="URL"> 在 <head> 里

    3.4 选择器格式 86

    3.4.1简单的选择器格式 h1{} h2{} p{}
    3.4.2 类选择器 p.classname{}
    3.4.3 通用选择器 .classname{}
    3.4.4 id选择器 #{}
    3.4.5上下文选择器 88：后代 ol li ，子元素 ol>li，特定子元素p:first/last/only-chile
    3.4.6 伪类 Pseudo Class h2:hover``textarea:focus
    3.4.7 通配选择器 *{}

    3.5 属性值的格式 property-value 90

    3.6 字体属性 91（粗看）

    3.6.1 字体族 font-family
    3.6.2 字体大小 font-size 92
    3.6.3 字体变体
    3.6.4 字体样式 font-style 93
    3.6.5 字体粗细 font-weight
    3.6.6 简写字体属性font注意属性值顺序，94
    3.6.7 文本修饰 text-decoration比如链接下划线 96
    3.6.8 文本间距 ~~`letter-spacing` 97~~

    3.7 列表属性 98

    3.8 文本对齐 102

    3.9 颜色 104（粗看）

    3.9.1 颜色组
    3.9.2 color属性

    3.10 盒模型 105

    3.10.1 边框
    3.10.2 内边距和外边距

    3.11 背景图片 110（粗看）

    3.12 标签和
    标签 112

    <span> inline; <div> block;

    第 4 章 JavaScript 基础知识

    4.1 JavaScript概述 120

    4.1.1 起源
    分为 3 部分：核心、客户端、服务器端。客户端是嵌入 HTML 的脚本语言。
    4.1.2 JavaScript 与 Java
    JS 弱类型、非严格意义的面向对象，但基于对象（4.2）。
    4.1.3 JavaScript的用途
    优势：Advantages:
    (1)Provide an alternative to server-side programming.

      - Servers are often overloaded
  - Client processing has short reaction time

    (2)JavaScript can interact with the internal model of the web page

      - JS was made possible by the development of DOM (Document Object Model, DOM).

    (3)JavaScript provides more complex user interfaces.
    移动端脚本任务：Task:
    respond to events (event-driven)
    4.1.4 浏览器和 HTML/JavaScript 文档：脚本的两种嵌入方式 见 4.3
    嵌入位置的选择：

    • <head></head>： 不会立即解释，当调用才解释。适合请求和响应用户操作的按钮、函数定义。

    • <body></body>：立即解释，且只解释一遍。

      4.2 面向对象和 JavaScript 122

    • object-based

    • Data properties and Method properties( functions and methods )

    • The root object in JavaScript is Object, which has no data properties, but several method properties.

      4.3 一般的语法特征 123

      两种嵌入方式：

    • 显式：explicitly：

<script type="text/javascript">
<!--
/ scripts /
// -->
</script>

  • 隐式：implicitly：<script type="text/javascript" src=""></script>

位置选择：见 4.1.4

4.4 基本数据类型、操作和表达式

全部掌握
4.4.1基本数据类型
4.4.2 数值型和字符串字面量
4.4.3 其他基本数据类型
4.4.4 声明变量
应该尽量使用 var 显式声明。
显式声明未赋值 => undefined；非显式声明未赋值 => null（保留字）。
4.4.5 数值运算符
4.4.6 Math 对象 Math.round(x)
4.4.7 Number 对象
导致数值计算错误的结果 => NaN，不可比较，用 isNaN(x) 判断。
x.toString(可填进制如：2)
4.4.8 字符串连接运算符 +
4.4.9 隐式类型转换

  • null 作为数值是 0，undefined 是 NaN，""作为数值是 0
  • 乘号 * 会优先转换数值 vs +
  • 转 Boolean 见 4.6.1

4.4.10 显式类型转换 String(x)、Number(x) == str - 0
有数值之外其它符号可能会失败，考虑其它更牛的方法 131
4.4.11 String 属性和方法 .length 更多见132表
4.4.12 typeof 运算符 typeof x 或 typeof(x)
4.4.13 赋值语句
4.4.14 Date 对象（4.6）

4.5 屏幕输出和键盘输入 （屏幕显示）133

  • Window 对象的属性 window 和 document，是 JS 默认对象：
    • alert("");
    • var xboolean = confirm("");
    • var xvalue = prompt("","value")
    • document 调用 Document 对象的属性：
      • document.write("") 可用来创建 html 代码，常包含 “</ br>”

  • 示例：二次方程求根 136

    4.6 控制语句 136

    4.6.1 控制表达式 <``>``=``==``!=``!==…

  • ""、"0"、null、NaN、undefined => false

4.6.2 选择语句 if(){}else{} 138
4.6.3 switch 语句 switch(){case value_1: break; default: ;} 138
4.6.4 循环语句 141

4.7 创建和修改对象 143

对象见 4.11 一起
for(var xkey in xobject) 注意值是 xobject[xkey]

4.8 数组 144

本质是对象，key 即 index。
4.8.1 创建 Array 对象 144 考到了
var xarray = new Array(1, 2, "three"); 等价 var xarray = [1, 2, "three"]
注意 var yarray = new Array(100) 只有一个参数时，指定长度而非值
4.8.2 Array 对象的特征 145
x.length可以任意设置，但实际使用的空间根据赋值情况而定，即 100 的长度可以只用 50-99
示例：插入名字，按字母顺序（A>a）。可用下一节方法简化。 146
4.8.3 Array 方法 146
copy: .join("") 用””连接数组； .concat()追加元素。.slice(含下标a,不含下标b)取 substring 可只填下标a
reference: .reverse() 颠倒顺序； .sort() 转字符串后按字母顺序排序。
4.8.3 二维数组 Two-dimensional Arrays 148

4.9 函数 148 大小题考到了函数调用

本质也是对象。
4.9.1 基础知识 148
没有返回值 return 的是 undefined
4.9.2 局部变量优先 149
4.9.3 参数 150
实参 actual parameters 传递进函数里的形参 formal parameters，对于 fun(a){} 现调用 fun(x)

  • 注意！！函数处理形参不影响实参值：指的是： a 任何赋值上的变化不会影响 x，当 a 为数组，赋值改变的是引用关系，不会影响原来 x 指向的数组，但如果改变 a 的元素，x 的元素对应改变，因为是对引用的对象直接处理（处理对象的元素），和本身的值（引用关系）无关了！

可以传不同参数数量：利用对象自带的属性数组变量 augments.length 获取实际参数数，示例：151
4.9.4 复习 sort 方法 152

4.10 示例 1：求数组中的数值中值 53

4.11 构造函数 154

function person(firstname,lastname,age)
{
    this.firstname = firstname;
    this.lastname = lastname;
    this.age = age;

    this.changeName = changeName;

    function changeName(name)
    {
        this.lastname=name;
    }
}

var myself = new person("l","zx",11);

// vs 没有构造器时
var oldmyself = {firstname:"l", lastname:"zx", age:11}
var oldmyself2 = new Object;
oldmyself2.firstname = "l";
oldmyself2.lastname = "zx";
oldmyself2.age = "11";

第 5 章 JavaScript 与 HTML 文档

5.1 JavaScript 的执行环境 Window 对象 168

5.2 文档对象模型 DOM 168

Document Object Model；JS 与 DOM 的绑定 en.196

5.3 在 JavaScript 中访问元素 3 种方式 172

这里写出最规范的第 3 种：var dom = document.getElementById("");
示例：利用隐式数组对复选框/单选框定位 173-174/181；其实我可以用 getElementByClassName() 呀~低版本浏览器可能不支持。

5.4 事件与事件处理 174

5.4.1 事件处理的基本概念 174
5.4.2 事件、特性和标签 175 

// 方法 1 
<input type=“button” name=“myButton” onclick=“alert(‘You clicked the button!’)”/>
// 方法 2
<input type=“button” id=“myButton” name=“myButton” onclick=“myHandler()”/>
// 方法 3 js 中，注意没有括号！！！
document.getElementById("myButton").onclick = myHandler;

5.5 处理主体元素的事件 <body onload=""> 177

5.6 处理按钮元素的事件 （5.4.2）178

  • 采用方法 2，179

  • 采用方法 3，还用了 5.3 的隐式数组，182

    • 但遇到方法 3 不能传参的问题（因为不是调用函数不能有括号）
    • 但有自己的好处 en.212

      5.7 处理文本框和密码框元素的事件 183

      5.7.1 focus 事件 183
      示例：使文本框无法获取焦点
      5.7.2 验证表单输入 185
      示例：验证两次输入的密码是否正确 187

      第 7 章 XML 简介 237

      只有两分（应该是选择，但要求透彻理解）

      7.1 简介 237

      开发目的、作用、元标记语言

      7.2 XML 用途 239

      7.3 XML 语法 240

      区分大小写 vs html

      第 9 章 PHP 简介

      掌握所有 ppt 讲过的

      9.1 PHP 的起源和用途 301

      Hypertext Preprocessor, (原名 Personal Home Page, 后以回归式命名)

      9.2 PHP 概述 302

      内嵌于 HTML 的服务器端脚本语言。代替 JSP，ASP。
      PHP 处理器（类似 Javascript 解释器）输出html（两种模式）：要么复制 html 要么解释脚本插入 html。
      支持过程编程、面向对象编程。

      9.3 基本语法特征 <?php ?> 302

      php 中支持 include("");，此时是复制模式。
      额外支持 # 注释。

      9.4 基本数据类型、操作和表达式 303

      9.4.1 变量 $
      空：NULL（类型 NULL 唯一值）；判断空：IsSet($x) 得 FALSE 为空。
      9.4.2 整数类型
      9.4.3 双精度类型
      9.4.4 字符串类型
      没有字符类型，统统是字符串。
      '' 不处理转义 \ 和变量$x；而 ""正常处理。
      9.4.5 布尔类型 TRUE、FALSE
      NULL、空字符串""、整形数值 0 被处理为 FALSE（它们通常可以互相转换）；
      注意！0.0 被认为是 TRUE；
      9.4.6 算术运算符和表达式
      9.4.7 字符串操作
      .连接运算符，连接两个字符串，对比 js ！
      函数 306
      9.4.8 标量类型转换：显式和隐式
      三种显式转换、两种变量形式展示方法（gettype($x)、is_int($x)） 307
      9.4.9 赋值运算符

      9.5 输出 308

      echo "";``echo "","",""; 或 echo("");，没返回值。
      print("");或 print ""; 双引号会解释 html 标签，有返回值 1；注 print(47);是对的。
      printf("%d",$x); c语言
      日期 data("l, F jS"); 输出：Saturday, June 1st

      9.6 控制语句 309

      几乎完全相同
      9.6.1 关系运算符 elseif(尽量写这个吧我怕老师抽粪)
      9.6.2 布尔运算符and``&&``or``||``xor``!
      9.6.3 选择语句
      9.6.4 循环语句
      9.6.5 示例：结合 html css，计算次方表 312

      9.7 数组 312

      9.7.1 创建数组：2 种方式

  • $list[0]=17; $list[]=18; # 自动追加

  • $list=array(23, ‘xiv’, “bob”, 777);
  • $ages=array(“Joe” => 42, “Mary” =>41, “Bif”=>17);

9.7.2 访问数组元素

  • $ages[‘Mary’] $ages[1]
  • 一次性对应赋值：$trees=array(“oak”,”pine”,”binary”); list($a,$b,$c)=$trees;

9.7.3 数组处理函数

  • 提取键、值数组：array_keys($x);``array_values($x);
  • 长度：sizeof()
  • 删除：和删除变量一样：unset($x[1]);
  • 判断：is_array($x); in_array($expr,$x); 前在后吗
  • 字符串转数组：explode(" ", $xstr); 反向：implode(" ", $x);

9.7.4 数组元素的按序访问

  • 通过指针：
    • 当前元素 current($x); 下个元素 next($x); 上一个 prev($x); 先动指针再返回值 vs each($x); 详细见书 317
  • 通过foreach ($x as $key => $temp)
  • 栈

9.7.5 数组排序 318 示例

  • 传统数组：只有字符串、默认键 sort($x);
  • 散列：asort($x); 按值排序、ksort($x); 按键排序；

    9.8 函数 319

    9.8.1 函数的基本特征
    9.8.2 参数，默认按值传递，包括数组的元素也不会修改！vs js
    9.8.3 变量的作用域，global $x
    9.8.4 变量的生命周期，static $x

    9.10 表单处理 示例 328

    $_POST 和 $_GET

    第 13 章 基于 Web 的数据库访问 471

    13.5 使用 PHP 和 MySQL 实现数据库访问 482

    没有大题，选择和问答题和判断题
    13.5.2 连接 MySQL 并选择数据库 483
    13.5.3 请求 MySQL 操作 484 ```php $db = mysqli_connect(‘localhost’,’root’,’’,’enweb’); if (!$db) {
      die('Could not connect: ' . mysql_error());
    } else { 
      $query = “select * from v”;
  $result = mysql_query($db, $query);
    } mysqli_close($db); #显式终止

mysqli_num_rows($result); ## returns number of rows in the result.

mysqli_num_fields($result); ## returns the number of fields (columns) in the result.

mysqli_fetch_assoc($result); ## returns an array with the next row of results.

``` 13.5.4 PHP-MySQL 示例 485