HTML编程语言的语法和组成详解

一、HTML编程语言介绍

HTML(HyperText Markup Language,超文本标记语言)是用于创建网页的标准标记语言。它是一种标记语言,用于描述网页的结构和内容。HTML文档(也称为网页)由一系列的HTML元素组成,这些元素由标签定义。比如

<html> <head> <body> <p> <a> <img>

等等。浏览器读取HTML文档,并以网页的形式呈现给用户。
其作用是:HTML编程语言通知浏览器将接收的数据以指定方式在窗口展示,控制浏览器请求行为。

二、HTML的一些基本特性和组成部分

1、基本结构

一个基本的HTML文档结构如下:

<!DOCTYPE html>  
<html>  
    <head>  
        <meta charset="UTF-8">  
        <title>页面标题</title>  
    </head>  
    <body>  
        <!-- 这里是网页内容 -->  
    </body>  
</html>

<!DOCTYPE html> : 声明文档类型。
<html> : 文档的根元素。
<head> : 包含了文档的元数据,如字符集定义、标题、链接到样式表和脚本等。
<body> : 包含了网页的所有内容,如文本、图片、链接、列表、表格、表单等。

2、元素和标签

HTML元素由开始标签、内容和结束标签组成。例如,

<p>这是一段文本。</p>

其中,<p> 是开始标签,</p>是结束标签,中间的是内容。

3、属性

HTML元素可以有属性,这些属性提供了关于元素的额外信息。例如,

<a href="https://www.example.com">链接文本</a>

其中,href是一个属性,它的值是一个网址。

4、注释

在HTML中,可以使用 <!----> 来添加注释。注释不会被浏览器显示,但可以帮助开发者理解代码。

5、语义化

HTML5 引入了更多的语义化标签,如
<header> <footer> <article> <section>
等,这些标签不仅有助于描述网页内容,还有助于提高网页的可访问性和搜索引擎优化(SEO)。

6、与CSS和JavaScript的关系

HTML定义了网页的结构和内容,而CSS(层叠样式表)用于描述网页的样式(如颜色、布局等),JavaScript则用于实现网页的交互功能。三者通常一起使用,以创建功能丰富、样式美观的网页。

三、HTML编程语言语法规范

1、HTML编程语言中所有命令都是声明在标签中,比如<br>
2、HTML编程语言中所有命令都是预先定义好,不允许开发人员自行创建新的命令;
3、HTML编程语言中所有命令都是不区分大小写的,<BR><br><Br>换行展示,都是合法命令;
4、HTML编程语言中命令开发时主要通过对命令中属性进行赋值实现开发目的。
属性赋值时内容可以包含一个" "中,也可以包含在’ ',也可以省略双引号与单引号,此时属性之间必须采用空格进行隔离;

<input type="text" name="one"/><input type='text' name='one ' /><input type=text name=one/>

5、HTML编程语言中命令根据书写方式分为:双目标签命令与单目标签命令;
6、双目标签命令书写命令分别出现在开始标签与结束标签,比如<tr></tr>。双目标签命令在
书写时结束标签是不能省略的,比如<tr>,由于没有书写结束标签,因此是一个非法命令;
7、单目标签命令书写在一个标签之内,比如: <br/>。单目标签命令用于表示结束"/"可以省略不写,
比如<br/>, <br>这两个都是合法单目标签命令。

四、浏览器发送请求三要素(整体内容都是围绕这三要素,做一个解释!)

1、控制浏览器发送请求地址(两种方式)
2、控制浏览器发送请求采用请求方式(共七种,只考虑两种,GET、POST)
3、控制浏览器发送请求携带请求参数;

五、控制浏览器发送请求地址

1、超链接标签命令:
 1)格式:<a href="请求地址">提示信息</a>
 2)工作原理:
 超链接标签命令不会被浏览器自动执行。在用户使用鼠标单击超链接标签命令时,此时这个命令才会执行,执行要求浏览器立刻按照href属性地址发送请求。

2、表单标签命令
 1)格式:

<form action="请求地址">
	<input type=" submit"><!--提交按钮-->
</form>

 2)工作原理:
 表单标签命令不会被浏览器自动执行。在用户单击提交按钮时,此时表单标签命令被
触发执行。执行时要求浏览器立刻按照action属性地址发送请求。

六、控制浏览器发送请求采用请求方式

1、请求方式:决定浏览器在发送请求时行为特征
2、浏览器可以选择请求方式:7种,目前为止只考虑【POST请求方式】和【GET请求方式】
3、GET请求方式:
 1)要求浏览器发送请求时,携带的【请求参数数量】不能超过4K;
 2)要求浏览器发送请求时,必须在浏览器地址栏上将【请求参数信息】展示出来;
 3)要求浏览器发送请求时,必须将请求参数信息保存在Http请求协议包中【请求头】;
 4)要求浏览器在接收到服务器返回的资源文件内容后,必须将资源文件内容保存到浏览器的缓存。
4、POST请求方式:
 1)要求浏览器发送请求时,可以携带任意数量的【请求参数】
 2)要求浏览器发送请求时,必须在浏览器地址栏上隐藏请求参数信息
 3)要求浏览器发送请求时,必须将请求参数信息保存在Http请求协议包中【请求体】
 4)禁止浏览器将服务器返回资源文件内容进行保存【阅后即焚】
5、控制浏览器发送请求时采用GET请求方式
  1、超链接标签命令在执行时,要求浏览器必须采用GET方式发送请求;
  2、表单标签存在一个method属性,通过这个属性可以要求浏览器采用对应请求方式发送请求;

<form action="请求地址" method="get">
<form action="请求地址" method="post">
***method属性默认值是GET
<form action="" 请求地址">---->浏览器以GET方式发送请求;

6、控制浏览器发送请求时采用POST请求方式

<form method="post"></ form>

7、请求方式适用场景【面试】
 1、考虑到POST请求方式,用户可以将【病毒文件内容】发送到服务器上进行攻击。
 因此绝大多数门户级网站拒绝接收POST请求,日常开发过程绝大多数请求都是GET。
 2、在某些特殊场景下必须使用POST
  1)文件上传,必须使用POST;
  2)发起登录验证请求,必须使用POST;
  3)索要服务器中实时变化数据时(股票价格,车票数量等),必须采用POST。

八、控制浏览器发送请求携带请求参数

1、请求参数作用:
 比如用户通过浏览器访问服务端计算机动态资源文件student.class

class Student {
	public int add(int n1,int n2) {
		//请求处理
		int  sum=n1+n2;
		return sum;
	}
}

Http服务器:会先自己new一个实例对象!

student stu = new student() ;
stu.add(?,?)   // add方法运行时需要实参,需要由用户通过浏览器以请求参数方式提供

 浏览器发送请求时需要携带调用方法需要实参(请求参数)
 http://www.baidu.com?n1=100&n2=200 [n1=100&n2=200]就是浏览器发送请求参数。
2、请求参数格式
 浏览器发送请求时: 请求地址?请求参数名1=值1&请求参数名2=值2
3、浏览器发送请求时携带的请求参数来源:
 1)通过超链接标签命令指定请求参数
 2)通过表单域标签命令指定请求参数
4、通过超链接标签命令指定请求参数

<a href="http://www.baiducom?userName-mike&password=123">百度</a>

5、通过单域标签命令指定请求参数:
 1)一组声明在form标签内部的标签命令
 2)提示用户填写对应的【请求参数内容】,用于提供相对灵活的请求参数内容
 3)所有的表单域标签都拥有两个属性【name,value】
 name属性声明【请求参数名】 ,value属性声明【请求参数内容】

<form action="http://www.baidu.com">
<input type="text" name="userName" value= "mike"/>
<input type=" submit">

  当用户单击submit后,浏览器发送请求信息 http://www.baidu.com?userName=mike
6、表单域标签分类:
 1)<input/>
 2)<select></select>
 3)<textarea></textarea>
7、表单域标签value属性默认值
 1)大多数表单域标签value属性默认值是空字符串,userName=’ ’
 2)对于radio与checkbox来说,value属性默认值’on’字符串
8、表单域标签作为请求参数条件
 对于大多数表单域标签来说,只要同时满足以下两个条件,就可以作为请求参数
 1)必须声明在form标签内部
 2)必须声明name属性
 对于radio标签与checkbox标签来说在满足上述两个条件同时,
 还必须满足第三个条件才可以作为请求参数,
 3)radio与checkbox必须在【被选中】的情况下才可以作为请求参数
 如果表单域标签使用disabled来修饰时,失去作为请求参数条件
9、read0nly与disabled区别:
 readonly:要求当前标签中value属性只能看但是不能被修改。
 readonly不会影响表单域标签作为请求参数条件;
 disabled:设置当前标签为不可用状态,此时标签中value属性内容不能被修改的。
 disabled修饰的表单域标签是永远都不能作为请求参数;

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值