第9课 网页的数据编码课件- 2024—2025学年浙教版（2023）初中信息技术八年级上册

第9课 网页的数据编码 年 级：七年级 学 科：初中信息科技（浙教版） 导入 社交网站页面 购物车结算页面 百度搜索页面 2 网页的编码 文本数据在网页中的编码 网页的编码 <img>标签通过src属性指定图片的路径，浏览器根据路径加载图片。 4 网页的编码 音频数据在网页中的编码 网页的数据请求与响应 请求与响应过程 图书馆借书 6 网页的数据请求与响应 1.浏览器发送请求 用户在浏览器中输入网址，浏览器向服务器发送获取HTML数据的请求。 2.服务器响应处理 服务器接收到请求后，根据请求内容生成相应的HTML数据并返回给浏览器。 3.浏览器解析呈现 浏览器接收到服务器返回的HTML数据，解析并呈现出网页内容。 7 网页的数据请求与响应 请求图片数据 返回图片数据 请求音频数据 返回音频数据 请求视频数据 返回视频数据 多个媒体数据，多次请求与响应 开发者工具网络面板 9 学习任务一 打开一个网页，在开发者工具网络面板中查看网页数据的请求与响应过程。 网页中的交互——表单 问卷调查 用户登录 表单——连接用户与服务器 服务器 用户 表单给用户提供了向网页输入信息的便捷途径，也为网页将用户输入的信息准确地反馈给服务器提供了一种可靠的机制。 表单的标签 表单区域 表单在网页中的呈现 表单的代码定义——<form>标签 13 表单的基本属性 属性 描述 action 用于指定接收并处理表单数据的服务器程序的URL地址 method 定义表单数据的提交方式，其取值为get或post enctype 定义表单数据的编码类型 name 规定表单名称，以区分同一个页面中的多个表单 ` “AI主题小调查”标签实例 action 决定表单提交后数据的去向，如‘AI 主题小调查’表单中数据发往‘result.html’。同学们创建表单时，要依需求设置好接收页面哦。 “method 属性决定表单数据的传送方式。这里是‘get’方法，它比较简单直接，但不太安全，因为用户输入的数据会在 URL 中显示出来。 name 属性为表单提供了一个唯一的标识，便于代码中操作。‘invest’这个名字是根据表单用途命名的。同学们自己创建表单时，要记得给表单起一个合适的名字。 enctype 属性指定表单数据的编码方式。这里设置为‘text/plain’，表示以纯文本形式对表单数据进行编码。不同的编码方式适用于不同类型的数据传输。 15 学习任务二 完成“AI主题小调查”表单网页的制作。 表单数据的编码和传输 写信 装入信封 输入数据 表单数据 格式转换 数据封装等待发送 邮政运输 网络传输 收件派送 等待接收 响应呈现 拆信 投入信箱 17 小结 1318.1222 Lavf58.28.100 $$