爬虫-网页基础

HTML 基本语法

HTML:Hyper Text Markup Language, 超文本标记语言,是计算机语言的一种,由元素构成。

p元素

<p>Web 真好玩!</p>

由三大部分组成

  1. 开始标签:一对尖括号中间包裹这元素名称
  2. 元素内容:页面中用户可以看到的内容
  3. 结束标签:与开始标签类似,区别在于元素名称前有一个斜杠 /

a元素

互联网中必不可少的一个要素是超链接 ,对应到HTML语言中就是a元素

<a href="https://web.shanbay.com/codetime/home/" target="_blank">扇贝编程首页</a>

分析:

  1. <a href="https://web.shanbay.com/codetime/home/" target="_blank">为元素开始标签
  2. 扇贝编程首页,元素内容
  3. </a> 元素的结束标签

a元素的开始标签中有许多额外信息,这些信息就是元素的 属性

元素属性

元素的属性需要写在开始标签中,写成 属性名称="属性值"。元素的属性是额外信息,不会直接展示给用户,而是提供给浏览器、程序解析使用。

上面的例子中hreftarget是a元素的两条属性。

注:属性值是用英文双引号 ,多个属性之间使用一个空格隔开

最常见的属性还有class、id、和 style。

class和id是用来标识元素的。

class:标识某一类元素,在一份HTML文档中可以重复出现。

id: 标识具体的某一个元素。其值在整个HTML中是唯一的。

style:为元素设置样式。

img元素

<img src="https://media-image1.baydn.com/storage_media_image/svpyor/b070ba779623e1405ad77dc048f0552b.68b5c7778324e642ffaee2d1034fce98.png" alt="">

img 元素用来描述图片的。有两个属性:

src:图片来源属性

alt:用于替换的文本属性

注:img元素只有开始标签,没有元素内容以及结束标签。这就说到了一种元素叫空元素

空元素

有些元素不需要提供文本内容,自然不需要元素内容。那就是空元素

img元素,换行符 br(break)元素,水平分割线 hr(horizontal)元素均属于空元素。

ol元素

有序列表由外层 ol(ordered lists)元素li(list item)元素构成

ul元素

无序列表则是由外层 ul (unordered lists)元素 和内层 li 元素构成。

HTML 文档结构

我们从网页内容第一行看起。第一行的 !<DOCTYPE html> 表明该文件是 HTML 文档,便于浏览器正确解析,没有实际含义。DOCTYPE 之后的整个网页内容都包裹在 html 元素 中,这是约定俗成的格式。如此一来,网页内所有元素都是 html 元素的子元素,整个 HTML 文档像树一样开枝散叶,结构清晰明朗。因此,html 元素也被称为 根元素。

再往内部看,网页根元素最粗壮的两个分支,一个叫 head 元素 ,另一个叫 body 元素 。它们分别是网页的 网页头网页体

HTML规定:

  • 用 title 元素 设置网页标题,这个标题将显示在浏览器标签页上
  • 用 meta 元素 设置网元信息,这些信息包括网页使用什么样的字符编码方式、样式、整体布局,还包含页面描述信息和面向搜索引擎的搜索关键字等等。

head 元素中还有许多 link 元素script 元素,它们负责将 HTML 文档与对应的 CSS 样式、JavaScript 代码文件关联起来

相关推荐
小熊Coding4 小时前
重庆市旅游景点数据可视化分析系统
爬虫·python·数据挖掘·数据分析·计算机毕业设计·数据可视化分析·旅游景点
源码之家7 小时前
计算机毕业设计:Python智慧交通大数据分析平台 Flask框架 requests爬虫 出行速度预测 拥堵预测(建议收藏)✅
大数据·hadoop·爬虫·python·数据分析·flask·课程设计
心疼你的一切7 小时前
【矛与盾的博弈:ZLibrary反爬机制实战分析与绕过技术全解析】
人工智能·爬虫·python·网络爬虫
axinawang8 小时前
XPath与lxml解析库
爬虫·python
亿牛云爬虫专家9 小时前
爬虫踩坑实录:OkHttp 接入爬虫代理报 Too many tunnel connections attempted 深度解析
爬虫·okhttp·https·爬虫代理·connect·隧道代理·ip 切换
源码之家11 小时前
计算机毕业设计:Python汽车销量数据采集分析可视化系统 Flask框架 requests爬虫 可视化 车辆 大数据 机器学习 hadoop(建议收藏)✅
大数据·爬虫·python·django·flask·课程设计·美食
遇事不決洛必達11 小时前
AST反混淆脚本
javascript·爬虫·nodejs·ast·ob混淆
Data 实验室12 小时前
TaskPyro “小龙虾版本”专业爬虫管理平台来了:AI+分布式+IM 机器人,一套搞定企业级爬虫调度
人工智能·分布式·爬虫
源码之家13 小时前
计算机毕业设计:Python二手车交易价格预测分析平台 Django框架 随机森林 可视化 数据分析 汽车 车辆 大数据 hadoop(建议收藏)✅
大数据·爬虫·python·机器学习·django·汽车·课程设计
小白学大数据13 小时前
高并发场景下:平衡搜索引擎收录与爬虫流量负载方案
爬虫·搜索引擎·pycharm