- 博客(13)
- 收藏
- 关注
RSS订阅原创 给HTML初学者的三十条最佳实践
1.保持标签闭合以前，经常见到类似下面的代码（译注：这是多久以前啊……）：<li>Some text here. <li>Some new text here. <li>You get the idea.注意外面包裹的UL/OL标签被遗漏了（谁知是故意还是无意的），而且还忘记了关闭LI标签。按今天的标准来看，这是很明显的糟糕做法，应该100%避免。总之，保持闭合标签。否则，你验证html标签的时候可能遇到问题。更好的方式<ul>
2021-08-31 09:23:21
3382
原创 HTML页面的加载
HTML页面的加载实际上是基于http过程+浏览器对数据的解析渲染。http协议的请求过程是基于TCP协议的。http是要基于TCP连接基础上，简单的说，TCP单纯建立连接，不涉及任何我们需要请求的实际数据，简单的传输。http基于TCP建立的连接来收发数据，即实际应用上来的。一个HTML页面的加载的交互流程大致如下：0.输入URL1.解析URL2.构造并发送HTTP请求服务器的永久重定向响应（从http://example.com到http://www.example.com）...
2021-08-27 13:36:31
2339
原创 动态绑定HTML
在Web前端开发中，我们经常会遇见需要动态的将一些来自后端或者是动态拼接的HTML字符串绑定到页面DOM显示，特别是在内容管理系统（CMS：是Content Management System的缩写），这样的需求，更是遍地皆是。对于对angular的读者肯定首先会想到ngBindHtml，对,angular为我们提供了这个指令来动态绑定HTML，它会将计算出来的表达式结果用innerHTML绑定到DOM。但是，问题并不是这么简单。在Web安全中XSS（Cross-site scripting，脚本注入攻
2021-08-27 13:33:32
759
原创 了解HTML锚点
概念 <a>元素(或HTML锚元素, Anchor Element)通常用来表示一个锚点/链接。但严格来说，<a>元素不是一个链接，而是超文本锚点，可以链接到一个新文件、用id属性指向任何元素。如果没有<a>元素没有href属性的话，可以作为原本链接位置的占位符，常用于home链接 [注意]任何文档流内容都可以被嵌套，只要不是交互内容类别(如按钮、链接等)属性href href属性表示地址，共包括以下3种： 1、链接地址&...
2021-08-27 13:30:19
9842
原创 JavaScript与HTML交互——事件
JavaScript和HTML的交互是通过事件实现的。JavaScript采用异步事件驱动编程模型，当文档、浏览器、元素或与之相关对象发生特定事情时，浏览器会产生事件。如果JavaScript关注特定类型事件，那么它可以注册当这类事件发生时要调用的句柄。事件流事件流描述的是从页面中接收事件的顺序，比如有两个嵌套的div，点击了内层的div，这时候是内层的div先出发click事件还是外层先触发？目前主要有三种模型IE的事件冒泡：事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的元素
2021-08-26 13:27:00
1094
原创 前端响应式布局为什么是个坑？
一、什么是响应式布局？响应式设计：Responseive design，就是一个网站，一套代码能在所有终端能够正常展示，并不是为每个终端做一个特定版本，响应式是为解决移动互联网浏览器而诞生的。二、响应式设计步骤2.1、viewport 设置大多数移动端浏览器都将html页面的宽度作为可视区的视图以符合屏幕分辨率，所以我们需要利用 meta 设置 viewport ，将网页宽度设为设备宽度。在head中添加meta标签，设置设备的宽度作为视图大小，禁止缩放。代码如下：<meta
2021-08-26 13:21:15
130
原创 HTML渲染过程详解
用户输入url地址，浏览器根据域名寻找IP地址 浏览器向服务器发送http请求，如果服务器段返回以301之类的重定向，浏览器根据相应头中的location再次发送请求 服务器端接受请求，处理请求生成html代码，返回给浏览器，这时的html页面代码可能是经过压缩的 浏览器接收服务器响应结果，如果有压缩则首先进行解压处理，紧接着就是页面解析渲染 解析渲染该过程主要分为以下步骤：解析HTML 构建DOM树 DOM树与CSS样式进行附着构造呈现树 布局 绘制...
2021-08-26 09:07:35
4242
1
原创 HTML常用标签及其全称
<ahref="#">a 超级链接（anchor）</a><abbrtitle="abbreviation的简写">abbr 简写的（abbreviation）</abbr><acronymtitle="Jin Hua Tang is JHT">acronym 首字母缩略词（acronym）</acronym><address>address 地址（address）&...
2021-08-24 11:48:16
171
1
原创 了解html页面的渲染过程
页面的渲染有以下特点：单线程事件轮询 定义明确、连续、操作有序（HTML5） 分词和构建DOM树 请求资源并预加载 构建渲染树并绘制页面具体来说：当我们从网络上得到HTML的相应字节时，DOM树就开始构建了。由浏览器更新UI的线程负责。当遇到以下情况时，DOM树的构建会被阻塞：HTML的响应流被阻塞在了网络中 有未加载完的脚本 遇到了script节点，但是此时还有未加载完的样式文件渲染树构建自DOM树，并且会被样式文件阻塞。由于是基于单线程的事件轮询，即使没有脚本和样式的阻塞
2021-08-24 11:43:37
422
原创 HTML+CSS编写规范
在任何一个项目或者系统开发之前都需要定制一个开发约定和规则，这样有利于项目的整体风格统一、代码维护和扩展。由于Web项目开发的分散性、独立性、整合的交互性等，所以定制一套完整的约定和规则显得尤为重要。第一节CSS样式文件的命名建立样式表文件时，分类编写样式到下列样式表文件中，并统一放在【CSS】文件夹里： 主要 main.css 文字样式 font.css 表格 table.css.
2021-08-24 11:32:45
234
原创 25 个实用前端网站工具推荐
给大家整理了 25 个前端相关的学习网站和一些靠谱的小工具，包括一些小游戏、教程、社区网站和博客，以及一些资源网站，希望可以帮助到大家！▍CSS 相关●1CSSBattle-在线比拼 CSShttps://cssbattle.dev在线比拼 CSS ，一个挺有趣的竞争性游戏，一共有12个级别，需要你用 HTML和 CSS 100%还原它给出的页面，然后再尽量减少代码，你也可以查看全球的排行榜，看解决方案。●2Learn CSS layout - 学习C...
2021-08-20 16:08:13
336
原创 前端自学路线之js篇
level 1首先你要对js的基础知识进行系统的学习，脑海中先有一幅知识蓝图。我们现在说的js其实包含三部分：ECMAScript规范、DOM规范、BOM规范，你要知道这三部分都有哪些内容。其中ECMA规范定义了js作为一门编程语言的标准，包含变量基本类型、对象、函数、作用域、运算符、流程控制语句等。DOM规范则规定了js如何与网页进行交互，包括访问与操作DOM节点、不同类型的节点都有哪些特性和方法、事件的监听与传播等。BOM规范定义了js如何与浏览器进行交互，包含window对象、location对象
2021-08-20 15:37:11
560
原创 什么是前端路由？
前端路由在很多开源的js类库框架中都得到支持，如angularJS，Backbone，Reactjs等等。这篇文章主要和大家谈谈什么是前端路由，以及它的使用场景及优缺点1.什么是路由简单举例说明，假如我们有一台提供 Web 服务的服务器的网络地址是：10.0.0.1，而该 Web 服务又提供了三个可供用户访问的页面，其页面 URI 分别是：http://10.0.0.1/http://10.0.0.1/abouthttp://10.0.0.1/concat那么其路径就分别是 /，/about，/c
2021-08-20 15:29:14
765
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人