前端知识概述----公司内部的一次分享

这篇博客是对公司内部一次前端知识分享的总结,涵盖了WEB前端的基本概念、浏览器显示网页流程、XHTML与HTML的区别、DOCTYPE的种类、行内元素与块级元素、CSS盒模型、JavaScript数据类型、jQuery的ajax对象、JSON对象以及HTML5的简介。内容适合对前端开发有一定了解的初学者,旨在提供基础知识的入门指导。
摘要由CSDN通过智能技术生成

因为公司内部一个纯后端团队要做一些适合自己团队的web页面,所以就有了这次分享。知识都是很基础,有的知识也只是做了解简单介绍。主要是想让大家对前端有一个基本的了解。现在做一个总结。欢迎大家拍砖。

知识概要

主要知识和分享要点如下的思维导图所示:
这里写图片描述

1)WEB前端是什么?

今天的web前端的重要的组成部分:
这里写图片描述

2)WEB浏览器显示网页的基本流程

注意:图片中的10年前有些夸张,而且那个时候还没有Chrome,只是为了便于理解

①10年前
这里写图片描述

②当今
这里写图片描述

3)XHTML和HTML的区别

这里写图片描述
代码示例:

<!--1.XHTML 标签必须小写-->

<BODY>
    <p>大写标签不标准</p>
</BODY>

<body>
    <p>XHTML标签必须小写</p>
</body>
<!--2.XHTML 属性名必须小写-->
<img SRC="" WIDTH="" />
<img src="" width="" />
<!--3.XHTML 中标记必须严谨嵌套-->
<ul>
    <li></li>
    <li>
        <ul>
            <li></li>
        </ul>
        <li></li>
</ul>
<ul>
    <li>严谨嵌套</li>
    <li>
        <ul>
            <li></li>
        </ul>
    </li>
    <li></li>
</ul>
<!--4.XHTML 中标记必须封闭-->
<p>你好啊!
    <p>我是封闭的标记元素</p>
    <!--5.XHTML 即使空元素的标记也必须封闭-->
    换行
    <br> 水平线
    <hr> 换行
    <br/> 水平线
    <hr/>
    <!--6.XHTML 属性值必须使用双引号括起来-->
    <p class=nihao>
        <p class="nihao"></p>
        <!--7.XHTML 属性值必须使用完整形式-->
        <input disabled>
        <input disabled="" />
        <!--8.XHTML 应该区分“内容标记”和“结构标记”-->
        <p>
            <table></table>
        </p>
        <table>
            <thead>
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值