前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >前端web基础复习

前端web基础复习

作者头像
不爱吃糖的程序媛
发布2024-01-18 19:45:38
1170
发布2024-01-18 19:45:38
举报
文章被收录于专栏:夏天的前端笔记

web复习内容

HTML

HTML的定义

超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。能表现如文字、视频、音频、程序等复杂元素。

标签

标签对的组成:标签名、属性(名值对)、内容。 属性类似是给这个标签的内容加了个装备,让这些标签具有一些特殊的能力。

代码语言:javascript
复制
<a href="www.baidu.com">百度</a>

重要标签说明

  • 表格标签 table thead tr th tbody tr td
代码语言:javascript
复制
<table border="1">
   <thead>
      <tr>
          <th>表头1</th>
          <th>表头2</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>内容1</td>
         <td>内容2</td>
      </tr>
   </tbody>
</table>

建议定义表格的时候,把 tbody,thead 都描述出来。

  • 表单标签 form action:submit 操作执行的请求地址 method:指定请求的类型 get/post 1.form 表单提交是不一定要通过 submit 操作的,可以通过 A JAX 请求序列化表单(serialize())的方式完成表单数据的提交。(A JAX 序列化就是将 form 中的数据构建为明值对的字符串统一的提交到后台) 2.通过 form 表单提交和 A JAX 请求方式提交数据是两个原理完全不一样的设计方式。
  • 表单元素标签 通过submit提交,浏览器会把表单元素的数据以名值对的方式提交给服务器。
代码语言:javascript
复制
<input>:type(text,password,radio,checkbox,hidden)
<select>
<textarea>

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

代码语言:javascript
复制
<form>
   <select>
      <option value="html">内容</option>
      <option value="html">内容</option>
      <option value="html">内容</option>
      <option value="html">内容</option>
      <option value="html">内容</option>
   </select>
</form>

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

标签的语义

H1/H2/H3 表现大纲级别 div/span/p 表现布局 使用带语义的标签可以让搜索引擎快速的进行收录 虽然不同的标签也许能够达到相同的显示效果,但是强烈建议使用语义化标签+CSS样式去控制

代码语言:javascript
复制
<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 布局基础,充分理解盒子模型
  • box-sizing
  • 样式选择器:ID(#) Class(.) 标签(A DIV SPAN)

JavaScript

  • 对于javascript编程语言的认识: 一门成熟的编程语言应该具备:变量、数据类型、运算符、控制语句(顺序结构、分支结构、循环 结构)、自成体系的 API。
  • JavaScript 的作用 1.业务逻辑处理。 2.对 DOM 进行操作(DOM : Document Object Model):通过事件驱动页面模型发生变化(DOM 树中元素的增删改查,特别是改:改内容,改样式),JavaScript 能操作 DOM 的原因在于JavaScript 实现了 DOM 相关操作的接口,能满足对 DOM 的操作。

需要掌握的内容

JavaScript 是弱类型语言,而且书写是比较随意的。

  • 弱语言体现在变量是没有准确的数据类型定义。通过 var 关键字定义。
代码语言:javascript
复制
// 动态类型,随值的变化而变化
var flag = 'abc'; flag = 12;
flag = true;
flag = {name : 'Tom'}; flag = function() {
alert("Hello,JavaScript");
}
  • 关于 JavaScript 的判断条件 1.在条件表达式中,数字0和非0也可以表现为false和true。 2.分支结构的三种表示方式。 3.三目运算符是需要熟练掌握的,其本质就是个表达式。
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2024-01-18,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • web复习内容
    • HTML
      • HTML的定义
        • 标签
          • 重要标签说明
            • 标签的语义
              • 关于浏览器
                • CSS
                  • 如何书写定义元素样式
                    • 需要掌握的内容
                      • JavaScript
                        • 需要掌握的内容
                        相关产品与服务
                        云服务器
                        云服务器(Cloud Virtual Machine,CVM)提供安全可靠的弹性计算服务。 您可以实时扩展或缩减计算资源,适应变化的业务需求,并只需按实际使用的资源计费。使用 CVM 可以极大降低您的软硬件采购成本,简化 IT 运维工作。
                        领券
                        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档