初中信息技术浙教版八年级上册：第9课 网页的数据编码-教学课件.pptx

第9课网页的数据编码年级：七年级学科：初中信息科技（浙教版）

导入社交网站页面购物车结算页面百度搜索页面

网页的编码文本数据在网页中的编码

网页的编码img标签通过src属性指定图片的路径，浏览器根据路径加载图片。

网页的编码音频数据在网页中的编码

网页的数据请求与响应请求与响应过程图书馆借书

网页的数据请求与响应1.浏览器发送请求

用户在浏览器中输入网址，浏览器向服务器发送获取HTML数据的请求。

2.服务器响应处理

服务器接收到请求后，根据请求内容生成相应的HTML数据并返回给浏览器。

3.浏览器解析呈现

浏览器接收到服务器返回的HTML数据，解析并呈现出网页内容。

网页的数据请求与响应请求图片数据返回图片数据请求音频数据返回音频数据请求视频数据返回视频数据多个媒体数据，多次请求与响应

开发者工具网络面板

学习任务一打开一个网页，在开发者工具网络面板中查看网页数据的请求与响应过程。

网页中的交互——表单问卷调查用户登录

表单——连接用户与服务器服务器用户表单给用户提供了向网页输入信息的便捷途径，也为网页将用户输入的信息准确地反馈给服务器提供了一种可靠的机制。

表单的标签表单区域表单在网页中的呈现表单的代码定义——form标签

表单的基本属性属性描述action用于指定接收并处理表单数据的服务器程序的URL地址method定义表单数据的提交方式，其取值为get或postenctype定义表单数据的编码类型name规定表单名称，以区分同一个页面中的多个表单

`“AI主题小调查”标签实例action决定表单提交后数据的去向，如‘AI主题小调查’表单中数据发往‘result.html’。同学们创建表单时，要依需求设置好接收页面哦。“method属性决定表单数据的传送方式。这里是‘get’方法，它比较简单直接，但不太安全，因为用户输入的数据会在URL中显示出来。name属性为表单提供了一个唯一的标识，便于代码中操作。‘invest’这个名字是根据表单用途命名的。同学们自己创建表单时，要记得给表单起一个合适的名字。enctype属性指定表单数据的编码方式。这里设置为‘text/plain’，表示以纯文本形式对表单数据进行编码。不同的编码方式适用于不同类型的数据传输。

学习任务二完成“AI主题小调查”表单网页的制作。

表单数据的编码和传输写信装入信封输入数据表单数据格式转换数据封装等待发送邮政运输网络传输收件派送等待接收响应呈现拆信投入信箱

小结