对于web前端基础学习的复习总结

对于web前端基础学习的复习总结

一、HTML 

什么是HTML?
htm1. 超文本标记语言,是一种描述性标记语言,用来描述页面内容的显示方式
   2. 理解HTML本质是超文本标记语言,能表现如文字、视频、音频、程序等复杂元素。
什么是标签?
   标签对的组成:标签名、属性(名值对)、内容
     属性类似是给这个标签的内容加了个装备,让这些标签具有一些特殊的能力
 重要标签说明
    表格标签 table
    thead tr th
    tbody tr td
在定义表格的时候,将 tbody,thead 都描述出来。
表单标签 form
    __action__:submit 操作执行的请求地址
    __method__:指定请求的类型 get/post
    1. form 表单提交是不一定要通过 submit 操作的,可以通过 AJAX 请求序列化表单(serialize())的
    方式完成表单数据的提交。(AJAX 序列化就是将 form 中的数据构建为明值对的字符串统一的提
    交到后台)
    2. 通过 form 表单提交和 AJAX 请求方式提交数据是两个原理完全不一样的设计方式。
表单元素标签
    通过submit提交,浏览器会把表单元素的数据以 __名值对__ 的方式提交给服务器。
    `<input>:type(text,password,radio,checkbox,hidden) `
    `<select> `
    ` <textarea> `
    关于 select 如何在 JS 中获取选中的值和选中的文本内容,在提交数据的时候,默认只会将select中选中option的value值传递过去。
    form 是个什么样的概念?在Web 编程中,可以把 form 理解为一个数据集合(组),我们把这一组数据包裹在 form 中,统一提交后台,

    进行业务逻辑的处理,在一个页面中可以有多个 form 存在。
    但是在 AJAX 请求中,可以不要求有 form 存在。

    一个页面可以包含多个表单,但用户一次只能向服务器发送一个表单中的数据
    属性enctype取值可以是application/x-www-form-urlencoded、multipart/form-data或text/plain
标签的语义
    H1/H2/H3 表现大纲级别
    div/span/p 表现布局
     div用来表达一个逻辑块,属于块级元素
     span标签属于行内元素,用来选择特定文本
    使用带语义的标签可以让搜索引擎快速的进行收录
    虽然不同的标签也许能够达到相同的显示效果,但是强烈建议使用语义化标签+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 元素是不具备样式的,但是在不定义样式的情况下,不同的标签也能表现不同的显示样式,原因是浏览器对不同的标签是有个默认样式的。

    CSS样式有以下三种格式:内嵌样式、内部样式和外部样式
样式的优先级:
    1. 内联样式表的权值最高1000;
    2. ID选择器的权值为100
    3. Class类选择器的权值为10
    4. HTML标签选择器的权值为1
书写定义元素样式
    在开发过程中,一般都是通过外链的样式表去定义页面的样式,减低代码之间的耦合,让美工专业去做页面。
    简单的理解就是,可以让不同的人不在同一个页面修改文件,自己关心自己的工作。
需要掌握的内容
     DIV + CSS 布局基础,充分理解盒子模型
    box-sizing需要注意
     样式选择器:ID(#) Class(.) 标签(A DIV SPAN)
     display属性:
      1. 通过display属性可以将页面元素隐藏或显示出来;
      2. 通过display属性可以将元素强制改成块级元素或内联元素
    none:将元素设为隐藏状态
    block:将元素显示为块级元素,此元素前后会带有换行符
    inline:默认,此元素会被显示为内联元素,元素前后没有换行符
    盒子模型:是由内容(content)、边框(border)、内边距(padding)和外边距(margin)四部分组成
JavaScript
    JavaScript时候一种脚本语言,可以直接嵌入HTML页面中
    当用户在浏览器中预览该页面时,浏览器会解释并执行其中的JavaScript脚本
    JavaScript是一种通用的、跨平台的、基于对象和事件驱动并具有安全性的客户端脚本语言,其特点如下:
    1. 解释性
    2. 嵌套在HTML中
    3. 弱数据类型
    4. 跨平台
    5. 基于对象
    6. 基于事件驱动
 对于编程语言的认识:
    一门成熟的编程语言应该具备:变量、数据类型(String、Boolean、Array、Number和Undefinded)、运算符(赋值运算符、算术运算符、比较运算符、逻辑运算符、三元运算符)、控制语句(顺序结构、分支结构、循环结构)、自成体系的 API。
    流程控制是指通过控制程序执行的顺序,来完成一定的功能:
    1. 分支结构(if和switch)
     2. 循环结构(while、do while和for等)
    3. 转移语句(break、continue、return等)
     break语句
     在switch结构中,遇到break语句时,就会跳出switch分支结构
     在循环结构中,遇到break语句时,立即退出循环,不再执行循环体中的任何代码
     continue语句
    当程序执行过程中遇到continue时,仅仅退出当前本次循环,然后判断是否满足下一次循环的条件
JavaScript 的作用
  1. 业务逻辑处理
  2. 对 DOM 进行操作(DOM : Document Object Model):通过事件驱动页面模型发生变化(DOM树中元素的增删改查,特别是改:改内容,改样式),JavaScript 能操作 DOM 的原因在于JavaScript 实现了 DOM 相关操作的接口,能满足对 DOM 的操作。
 内容
    JavaScript 是弱类型语言,而且书写是比较随意的。
    弱语言体现在变量是没有准确的数据类型定义。通过 var 关键字定义。
     动态类型,随值的变化而变化 var flag = 'abc'; flag = 12; flag = true; flag = {name : 'Tom'}; flag = function() { alert("Hello,JavaScript"); }`
关于 JavaScript 的判断条件
    1. 在条件表达式中,数字0和非0也可以表现为false和true
    2. 分支结构的三种表示方式
    3. 三目运算符是需要熟练掌握的,其本质就是个表达式
     expression?value1:value2;

    动态类型,随值的变化而变化 var flag = 'abc'; flag = 12; flag = true; flag = {name : 'Tom'}; flag = function() { alert("Hello,JavaScript"); }

    函数是一组延迟动作集的定义,可以由事件或其他脚本进行调用,分为预定义函数和用户自定义函数

猜你喜欢

转载自www.cnblogs.com/98dkk/p/12363319.html