web前端

软件的构架：

B/S browser/server 浏览器/服务器
C/S client/server 客户端/服务器

 

资源分类：

静态资源：可以直接被浏览器解析 ；js是 javascript简称：客户端浏览器脚本语言，
无需编译能够被浏览器直接解析的

html、css、js ；css：层叠样式表

 动态资源：需要经过web服务器加载才可以被浏览器解析

jsp、php ;jsp是一种动态网页开发技术

html：

概念：超文本标记语言
超文本：超级文本，可以存放文本意外的其他内容
标记语言：由标签组成的语言 标签：<标签名>

语法：
1.以.html或者.htm结尾
2.标签分为围堵标签和自闭和标签
围堵标签 例：<a></a>
自闭和标签 例：<br/>
3.标签必须正确嵌套
4.标签属性写在开始标签中，属性值用引号引起来
5.标签不区分大小写

标签：
图片标签
<img>
属性src：图片所在的地址路径(相对路径)

相对路径：以.开头
./ 表示当前目录，可以省略
../ 表示上一级目录
/目录名/ 表示下一级某个目录

超链接标签
<a>
属性
href：超链接地址路径
target:_blank 表示从空白页打开地址链接


表格标签
<table>：定义表格
<tr>：定义一行
<td>：定义一个格子可以用<th>表示表头行

次要：
文本标签
<h1>~<h6>：标题
<p>：段落
<b>：加粗
<i>：斜体
<font>：字体
<br>：换行
<hr>：水平线
<center>：居中

列表标签
有序列表
<ol>
<li></li>
</ol>

无序列表
<ul>
<li></li>
</ul>

html&css:

表单标签
<form>
作用：用来收集用户信息的，涉及到web阶段的前后端的交互

属性：
action:表单提交的资源地址，#表示提交当前的页面
method:表单的提交方式，(请求方式)
get:
1.请求参数在地址栏中(请求行)
2.请求参数有大小限制
3.相对不安全
post:
1.请求参数在请求体中
2.请求参数没有大小限制
3.相对安全

表单项标签
表单项：
<input>
type:声明表单项的类型
取值：
text:文本框(明文)
password:密码框(密文)
radio:单选框，单选框的name属性值要一致，实际提交的是value属性的值，默认被选中需要给checked属性
checkbox:复选框，复选框的name属性值要一致，实际提交的是value属性的值，默认被选中需要给checked属性

hidden:隐藏域，用户在页面中不可见，但实际提交表单时可以提交隐藏域的value属性的值
file:文件域，用于上传文件

button:普通按钮
submit:提交按钮，点击后表单提交


name:表单项提交后的参数名字


value:给表单项默认值


placeholder:提示信息


id:任何标签都有id属性，表示标签唯一标识

 

下拉列表：
表单提交后的名字为select标签的name属性，值为option的value属性值，默认被选中需要在option标签中使用selected属性

JavaScript：

概念：简称js，客户端浏览器脚本语言，无需编译能够被浏览器直接解析的
作用：增强用户和html页面交互，从而提升用户体验

组成：
JavaScript = ECMAScript + BOM + DOM

BOM:Browser Object Model 浏览器对象模型
DOM:Document Object Model 文档对象模型

数据类型
原始数据类型
number：数字，包括整数与小数还有NaN
string：字符串，包含字符和字符串
boolean：true&false
null：对象为空就是null，对象为空的占位符
undefined：变量定义后没有赋值


引用数据类型
对象

定义变量
var 变量名 = 值;

一元运算符
++ -- ：自增自减在前，先自增(自减)，再运算，在后面，先运算，后自增(自减)
+ -：会将除了number类型意外的其他类型转为number
String -> number：如果是数字字符串构成的string，直接按照字面值转，如果不是转为NaN
boolean -> number：true 为1；false 为0
null -> number： 0
undefined -> number：NaN

比较运算符
< > <= >= == ===
比较运算符进行运算将两边的数值转为number，如果是两个字符串进行比较，比较字典对应值的顺序。
===：先比较数据类型，如果类型不一致直接返回false，如果类型一致再进行比较

逻辑运算符
&& || !
其他类型转boolean，一个宗旨：有值就为true，没有值或者""或者0转为false

三元运算符
表达式 ? 值1 : 值2

对象
funtion - 方法
定义方法：
1. funtion 方法名(形式参数列表){
方法体
}

2. var 方法名 = funtion(形式参数列表){
方法体
}
调用：
方法名(传参);