110
社区成员
发帖
与我相关
我的任务
分享Web与HTTP1_嘘嘘喵
概述
1、今天主要在做任务3-1和任务3-2，任务3-3稍微做了一点点，时间不太够了，明天继续。
2、把on java第六章的内容看完了，
3、学了一下C1认证的内容。
工作记录
1、使用富文本编辑器
自己在编辑器里随便摸了一下，表格、标题什么的都做了一次。
给自己的小任务是做了一个按钮。
用button的on click属性，点击后出现文字。代码如下：
<script>
function blueeyes(){
var x = "哦嘞诺普莱多，所洗爹哦嘞诺塔玛希，一碟哟，布鲁艾斯怀托多拉贡！";
document.getElementById("demo").innerHTML= x;}
</script>
<button onclick="blueeyes()">点击召唤你的老婆</button>
<p id="demo"></p>
效果如图：
点击后成功召唤青眼白龙：
2、抓包任务
1、使用Charles抓包。
在这个界面添加一个额外字段：
2、右键-compose
3、添加一个字段：
4、输入字段内容
5、点击执行
6、获取服务器返回数据，任务完成！
HTML
学习内容
HTML标签
特点：
-
尖括号+关键词，如<div>。
-
通常成对出现，如<div>和</div>，前一个是开始标签，后一个是结束标签
-
偶尔也有单独呈现的标签，如<img src="你好"/>
-
成对标签，内容夹在两标签中间。单独标签，内容在标签属性内。
-
网页的内容需在<html>标签中，标题、字符格式、语言、兼容性、关键字、描述等信息显示在<head>标签中，而网页需展示的内容需嵌套在<body>标签中。
FORM标签
form标签用于为用户输入创建 HTML 表单。
表单能够包含input元素，比如文本字段、复选框、单选框、提交按钮等等。
表单用于向服务器传输数据。
常用属性
| 属性 | 值 | 描述 |
|---|---|---|
| accept | MIME_type | HTML 5 中不支持。 |
| accept-charset | charset_list | 规定服务器可处理的表单数据字符集。 |
| action | URL | 规定当提交表单时向何处发送表单数据。 |
| autocomplete | on、off | 规定是否启用表单的自动完成功能。 |
| enctype | application/x-www-form-urlencoded、multipart/form-data、text/plain | 规定在发送表单数据之前如何对其进行编码。 |
| method | get、post | 规定用于发送 form-data 的 HTTP 方法。 |
| name | form_name | 规定表单的名称。 |
| novalidate | novalidate | 如果使用该属性，则提交表单时不进行验证。 |
| rel | external、help、license、next、nofollow、noopener、noreferrer、opener、prev、search | 规定链接资源和当前文档之间的关系。 |
| target | _blank、_self、_parent、_topframename | 规定在何处打开 action URL。 |
常用标签
p
作用：标记一个段落，会自动在在其前后创建一些空白。
a
作用：定义锚超链接，用于从一个页面链接到另一个页面。
该元素最重要的属性是 href 属性，它指定链接的目标。
例如：
<a herf="baidu.com">百度</a>
效果如下
div
作用：可定义文档中的分区或节（division/section）。可以把文档分割为独立的、不同的部分。
注意，div标签的内容会自动地开启一个新行。
img
作用：插入图片
特点：有两个必需的属性：
src属性：值为URL，作用是规定显示图像的URL。
alt属性：值为text，作用是规定图像的替代文本。
table
作用：定义HTML表格。
简单的表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。
tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。
button
作用：定义一个按钮。
特点在 button 元素内部，可以放置内容，比如文本或图像。这是该元素与使用 input 元素创建的按钮之间的不同之处。
<button>与</button> 标签之间的所有内容都是按钮的内容，其中包括任何可接受的正文内容，比如文本或多媒体内容。
<button type="button">点我!</button>
效果如下：
<button type="button">点我!</button>（反正就是一个按钮，写了“点我！”）
常用属性：
| 属性 | 值 | 作用 |
|---|---|---|
| name | button_name | 规定按钮的名称。 |
| type | button,reset,submit | 规定按钮的类型。 |
| value | text | 规定按钮的初始值。可由脚本进行修改。 |
title
作用：定义文档的标题。
特点：一般存在于head标签之中。
head
作用：定义文档的头部，它是所有头部元素的容器。
特点：<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。
文档的头部描述了文档的各种属性和信息，包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
下面这些标签可用在 head 部分：
base,link,meta,script,style,title。
其中，<title> 定义文档的标题，它是 head 部分中唯一必需的元素。应该把 head标签放在文档的开始处，紧跟在html后面，并处于body标签或frameset标签之前。
html
作用：告诉浏览器，自己是一个HTML文档。
body
作用：元素定义文档的主体。
特点：body 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等。）
input
作用：搜集用户信息。
根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
script
用于给页面添加脚本。
style
用于给文档引入 CSS 样式信息，将样式表包含在 style 开始与结束标签之间.
CSS样式表
何谓CSS？
CSS（层叠样式表）定义了 HTML 元素在页面中的样式、布局以及整个页面的布局。CSS 遵循 W3C 规范，实现了跨浏览器的标准化。
引入方式
行内样式：直接用HTML元素的style属性印入。
内嵌样式：使用<style>标签引入。
外部样式：
链接样式（最常用）：
在head标签中使用<link />标签链接外部CSS文件。
link 标签的 href 属性设置为目标链接的 CSS 文件路径，rel 属性设置为 "stylesheet"表示链接样式表，type 属性设置为"text/css"
例：
<link rel="stylesheet" href="style.css" type="text/css" />
导入样式：
使用@import()引入CSS文件
CSS背景属性
属性名格式：background-*
| 属性 | 值 | 作用 |
|---|---|---|
| color | 颜色值或transparent | 颜色 |
| image | url或none | 背景图像 |
| size | 宽高、百分比宽高 | 大小 |
| repeat | repeat -x -y | 重复方式 |
| postion | top left/ top center | 图片位置 |
CSS文本属性
color：用于设置颜色，可设置的值有：颜色名、16进制值、RGB值。
font-size：字体大小。绝对大小（单位为px），相对大小（单位为rem、em等）。
font-weight：文本粗细。normal，bold，bolder，lighter，数字（400相当于normal，700相当于bold）
font-family：文本字体或字体列表。（如果浏览器不支持第一个，则用第二个，以此类推。
text-align：设置文本的对齐方式。
line-height：设置行间距。值可以为：固定值（固定行距）、数字or百分比（当前字体大小的倍数）。
text-indent：首行缩进值。
letter-spacing：字间距。
word-spacing：单词之间的间距。
text-decoration-*：文本的装饰线。
line：装饰线类型。
属性值：
none：无线条
overline：上划线
underline：下划线
line-through：删除线
color：颜色。
属性值：颜色名、rgb、16进制颜色等。
sytle：装饰线样式。
属性值：
solid：实线
double：双实线
dotted：点划线
dashed：虚线
wavy：波浪线
text-transform：设置文本大小写字母。
writing-mode：文本的水平或垂直
horizontal-tb：水平。
vertical-lr：文本流向垂直，文字方向水平，上至下，左至右。
sideways-lr：垂直，左至右。
sideways-rl：垂直，右至左。
white-space：设置文本的空格处理方式。
JavaScript
打印数据
JS不提供任何内建的打印或显示函数。
JavaScript 显示方案
JavaScript 能够以不同方式“显示”数据：
-
使用 window.alert() 写入警告框
-
使用 document.write() 写入 HTML 输出
-
使用 innerHTML 写入 HTML 元素
-
使用 console.log() 写入浏览器控制台
script 标签
在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间。
语句构成
JavaScript 语句由以下构成：
值、运算符、表达式、关键词和注释。
变量声明
var+变量名
变量初始化：声明变量但不赋值，其值为undefined。
赋值后再次声明该变量，其值不变，仍是赋值给的值。
Undefined
变量初始化：声明变量但不赋值，其值为undefined。
任何变量均可通过设置值为 undefined 进行清空。其类型也将是 undefined。
null
JS中，null 是 "nothing"。它被看做不存在的事物,但null 的数据类型是对象。
可以通过设置值为 null 清空对象：
实例：
var person = null; // 值是 null，但是类型仍然是对象
类型运算符
typeof：返回变量的类型。
instanceof：返回true，如果对象是对象类型的实例。
typeof
原始数据
一种没有额外属性和方法的单一简单数据值。
typeof 运算符可返回以下原始类型之一：
-
string
-
number
-
boolean
-
undefined
实例
typeof "Bill" // 返回 "string"
typeof 3.14 // 返回 "number"
typeof true // 返回 "boolean"
typeof false // 返回 "boolean"
typeof x // 返回 "undefined" (假如 x 没有值)
复杂数据
typeof 运算符可返回以下两种类型之一：
-
function
-
object
typeof 运算符把对象、数组（在JS中，数组即对象）或 null 返回 object。
typeof 运算符不会把函数返回 object。
实例
typeof {name:'Bill', age:62} // 返回 "object"
typeof [1,2,3,4] // 返回 "object" (并非 "array"，参见下面的注释)
typeof null // 返回 "object"
typeof function myFunc(){} // 返回 "function"
对象
用花括号
属性是name:value对，类似字典。
如：
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
注释、标识符、命名、四则运算、赋值运算符（+=）、字符串+、逻辑运算符、布尔值、数组、函数、局部变量、等规则与java基本相同。
HTTP协议
HTTP——超文本传输协议（Hyper Text Transfer Protocol，HTTP）是一个简单的请求-响应协议，它通常运行在 TCP 之上。
关注 HTTP 请求头和响应头（Request Headers 和 Response Headers）中的内容以及其中的作用
cookie与session
写出 Cookie 和 Session 的区别（有多少就写多少）
| 区别 | Cookie | Session |
|---|---|---|
| 1 数据保存位置 | 客户端 | 服务器端 |
| 2 安全性 | 一般 | 较高 |
| 3 占用服务器性能 | 良好 | 访问增多时对服务器性能影响较大 |
| 4 存储对象 | 只能String类型 | 能存储任意的java对象 |
| 5 储存限制 | 单个不超过4K，很多浏览器限制一个站点最多保存20个cookie | 大小限制跟服务器有关，一般限制较小 |
《On Java》
enum
可以理解为一个枚举类
明日计划
1、任务3-3，老师说估计要2天才能搞定，我不信！争取一天搞定！
2、有余力的话继续看onjava
...全文
请发表友善的回复…
发表回复
