HTML

**是一种超文本标记语言,能表现如文字、视频、音频、程序等复杂元素**

1.标签

  • 是尖括号包围的关键字
  • 成对存在的
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签

例如:

<a href="https://www.baidu.com">百度</a>

其中herf是属性,类似于一种装备让标签具有特殊的能力

重要标签

  • 表格标签 table
    <th> 标签表示表头,大部分情况显示为粗体居中的文本。
    <tr>标签表示行;<td>表示单元格,其中包括的内容就是单元格的数据

html css JavaScript是语句嘛_内边距

在定义表格的时候,最好把thead,tbody都加上

  • 表单标签form
    action:submit 操作执行的请求地址
    method:指定请求的类型 get/post
  1. form 表单提交是不一定要通过 submit 操作的,可以通过 AJAX 请求序列化表单(serialize())的方式完成表单数据的提交。(ajax 序列化就是将 form 中的数据构建为键值对的字符串统一的提交到后台)
  2. 通过 form 表单提交和 AJAX 请求方式提交数据是两个原理完全不一样的设计方式。
  • 表单元素标签
    通过submit提交,浏览器会把表单元素的数据以名值对的方式提交给服务器。

关于 select 如何在 JS 中获取选中的值和选中的文本内容,在提交数据的时候,默认只会将select中选中option的value值传递过去。

html css JavaScript是语句嘛_表单_02

可以把 form 理解为一个数据集合(组),我们把这一组数据包裹在 form 中,统一提交后台,进行业务逻辑的处理,在一个页面中可以有多个 form 存在。但是在 AJAX 请求中,可以不要求有 form 存在。

标签的语义

H1/H2/H3 表现大纲级别
div/span/p 表现布局

使用带语义的标签可以让搜索引擎快速的进行收录
虽然不同的标签也许能够达到相同的显示效果,但是强烈建议使用语义化标签+CSS样式去控制

<style>
.hstyle {
display: block;
font-size: 2em;
font-weight: bold;
}
</style>
<h1>标题1</h1>
<span class="hstyle">标题1</span>

关于浏览器

浏览器就是能解析HTML、CSS、JavaScript、图片、音视频等内容的运行环境。
我们一般说的浏览器是指包括:IE/Firefox/Chrome/Opera等等,其中Firefox/Chrome我们称之为标准
浏览器,最符合W3C组织定义的相关技术规范。

如果没有一个规范定义,为了迎合不同厂商的浏览器,程序员将为此付出沉重的代价。但是即便
如此,不同的浏览器之间还是有些细微的差异的,这个一般是前段开发要注意的问题,要考虑浏
览器的兼容性。
我们一般使用360、搜狗都是基于某个浏览器内核深度改造的。

CSS

层叠样式表:元素样式可以通过多种方式进叠加。

本身HTML 元素是不具备样式的,但是在不定义样式的情况下,不同的标签也能表现不同的显示样式,原因是浏览器对不同的标签是有个默认样式的。

如何书写定义元素样式

在开发过程中,一般都是通过外链的样式表去定义页面的样式,减低代码之间的耦合,让美工专业去做
页面。
简单的理解就是,可以让不同的人不在同一个页面修改文件,自己关心自己的工作。

需要掌握的内容DIV + CSS 布局基础,充分理解盒子模型

  • 盒子模型
    封装周围的HTML元素,它包括:边距,边框,填充,和实际内容
  • html css JavaScript是语句嘛_CSS_03

  • Margin(外边距) - 清除边框外的区域,外边距是透明的。
    Border(边框) - 围绕在内边距和内容外的边框。
    Padding(内边距) - 清除内容周围的区域,内边距是透明的。
    Content(内容) - 盒子的内容,显示文本和图像。
  • html css JavaScript是语句嘛_表单_04

box-sizing需要注意:

content-box  是默认值。如果你设置一个元素的宽为100px,那么这个元素的内容区会有100px 宽,并且任何边框和内边距的宽度都会被增加到最后绘制出来的元素宽度中。
border-box 告诉浏览器:你想要设置的边框和内边距的值是包含在width内的。也就是说,如果你将一个元素的width设为100px,那么这100px会包含它的border和padding,内容区的实际宽度是width减去(border + padding)的值。大多数情况下,这使得我们更容易地设定一个元素的宽高。
  • 样式选择器

JavaScript

对于编程语言的认识:
一门成熟的编程语言应该具备:变量、数据类型、运算符、控制语句(顺序结构、分支结构、循环
结构)、自成体系的 API。
JavaScript 的作用

  1. 业务逻辑处理
  2. 对 DOM 进行操作(DOM : Document Object Model):通过事件驱动页面模型发生变化(DOM树中元素的增删改查,特别是改:改内容,改样式),JavaScript 能操作 DOM 的原因在于
    JavaScript 实现了 DOM 相关操作的接口,能满足对 DOM 的操作。

需要掌握的内容

弱语言体现在变量是没有准确的数据类型定义。通过 var 关键字定义。

var flag = 'abc';
flag = 12;
flag = true;
flag = {name : 'Tom'};
flag = function() {
alert("Hello,JavaScript");
}

关于 JavaScript 的判断条件

  1. 在条件表达式中,数字0和非0也可以表现为false和true
  2. 分支结构的三种表示方式
  3. 三目运算符是需要熟练掌握的,其本质就是个表达式
var age = 20;
var str = age >= 18 ? '成年' : '未成年' ;
console.log(str);