前端萌媛的成长之路-腾讯云开发者社区

开发者社区

文档建议反馈控制台

腾讯云架构师技术同盟

文章/答案/技术大牛

发布

前端萌媛的成长之路

专栏成员

24

文章

49054

阅读量

25

订阅数

WebAssembly分享

什么是WebAssemblely WebAssembly是一种运行在现代网络浏览器中的新型代码并且提供新的性能特性和效果。它设计的目的不是为了手写代码而是为诸如C、C++和Rust等低级源语言提供一个高效的编译目标。对于网络平台而言，这具有巨大的意义——这为客户端app提供了一种在网络平台以接近本地速度的方式运行多种语言编写的代码的方式；在这之前，客户端app是不可能做到的。目标快速，高效，可移植--通过利用通用的硬件功能，可以在不同的平台上以接近原生代码执行的速度执行WebAssembly代码。

2018-06-13

2.9K0

在HTML中使用JavaScript

前言 JavaScript是浏览器的内置脚本语言。当网页中嵌入了JavaScript脚本，浏览器加载网页时，就会执行脚本，从而操作浏览器，实现各种动态效果 JavaScript代码嵌入网页的方法 1、<script>元素直接嵌入代码 <script type="text/javascript"> function sayHello() { alert("hello!"); } </script> 2、<script>元素加载外部脚本 <script type="text/javascript" sr

2018-05-25

1.4K0

前端语义化

爬虫 html NLP 服务

什么是语义化语义化是指根据内容的结构，选择合适的标签，便于开发者阅读和写出更优雅的代码的同时，让浏览器的爬虫和机器很好的解析。为什么会出现语义化其实 HTML 在刚开始设计出来的时候就是带有一定的「语义」的，包括段落、表格、图片、标题等等，但这些更多地只是方便浏览器等 UA 对它们作合适的处理。但逐渐地，机器也要借助 HTML 提供的语义以及自然语言处理的手段来「读懂」它们从网上获取的 HTML 文档，但它们无法读懂例如「红色的文字」或者是深度嵌套的表格布局中内容的含义，因为太多已有的内容都是专门为了

2018-05-25

9040

浅谈前端安全

安全 php http https javascript

安全问题的分类按照所发生的区域分类后端安全问题：所有发生在后端服务器、应用、服务当中的安全问题前端安全问题：所有发生在浏览器、单页面应用、Web页面当中的安全问题按照团队中哪个角色最适合来修复安全问题分类后端安全问题：针对这个安全问题，后端最适合来修复前端安全问题：针对这个安全问题，前端最适合来修复综合以上前端安全问题：发生在浏览器、前端应用当中或者通常由前端开发工程师来对其进行修复的安全问题浏览器安全同源策略是一种约定，是浏览器最核心也最基本的安全功能，限制了来自不同源的docum

2018-05-25

4.9K0

position有几种，absolute和relative的区别

标签（空格分隔）：博文 ---- position有几种，absolute和relative的区别 1.static(默认属性)，当没有给元素设置position时默认为static 2.absolute（绝对定位），相对于父级第一个设置了position属性进行定位（没有则相对于body，static除外），top，left，bottom，right均是相对于这个父元素的偏移量 3.relative（相对定位），在元素原来的位置上进行定位，top，left，bottom，right的值相当于原来位置

2018-05-25

2.2K0

NPM基本介绍（一）

npm ruby java 单元测试

一、commonJS规范在介绍npm的前面，我们先介绍一下commonJS规范。commonJS规范的提出，主要是为了弥补js没有标准的缺陷，已达到Ruby和Java具备开发大型应用的基础能力，如今，commonJS中的大部分规范虽然依旧是草案，但是已经为javascript开发大型应用指明了一条非常棒方向，目前，它依然在成长，目前commonJS规范涵盖了模块、二进制、Buffer、字符集编码、I/O流、进程环境、文件系统、套接字、单元测试、web服务器网关接口、包管理等。而其中的npm则就是commo

2018-05-25

1.6K0

每个HTML的Doctype有什么作用？

前言 DOCTYPE标签是一种标准通用标记语言的文档类型声明，它的目的是要告诉标准通用标记语言解析器，它应该使用什么样的文档类型定义（DTD）来解析文档。 <!DOCTYPE> 声明帮助浏览器正确地显示网页。正文下面介绍DTD和、Doctype的作用及常用声明什么是DTD？ DTD(文档类型定义)是一组机器可读的规则，它们定义XML或HTML的特定版本中允许有什么，不允许有什么。在解析网页时，浏览器将使用这些规则检查页面的有效性并且采取相应的措施。浏览器通过分析页面的DOCTYPE声明来了解要使

2018-05-25

1.7K0

JavaScript模块化发展

ajax javascript

简介在最开始学习前端的时候只需要一个js文件就能玩转一个小的练手应用，但是随着自己不断的学习，ajax、jQuery等广泛应用，使得我们的代码量变得巨大，代码变得格外的混乱。现在迫切的需要我们将大段的代码分离开来。前端最开始并没有像java中package概念以及import那样的引包工具。JavaScript源生代码是在ES6的时候才正式的引入import这个API，来调用其他文件。在这之前也同样出现了很多社区来实现模块化开发。 ---- 发展历程注意下面会讲历史上面出现的一些类库，有一些现在已经没

2018-05-25

1.7K0

iframe+postMessage实现跨域通信

html5 api react vue.js javascript

前言需求背景：最近开发管理系统，需要在本页面跳转到一个图片管理系统上传图片，上传成功后返回图片链接，然后返回管理系统，显示图片实现思路：上传图片时，需要在本窗口跳转到图片管理系统，并且两个系统之间要通信考虑到两个系统是不同的端口号，存在跨域问题，这时发现HTML5新增了一个API-window.postMessage()，于是就决定用iframe结合window.postMessage()实现在页面中嵌入一个iframe，将图片管理系统嵌入到当前的管理系统中，结合window.postMessa

2018-05-25

5.3K1

我们在平常做项目的时候，float这个css属性经常会用到。元素浮动会让元素脱离文档流，从而不能撑开父级的内容。今天我将展示常见的清除浮动的方法。什么是浮动浮动元素脱离文档流并且向左或者向右移动，直到浮动元素的边缘碰到父级框或者另一个浮动元素的边框为止。浮动的影响浮动元素会使得父级元素高度塌陷 html: <ul> <li></li> <li></li> <li></li> </ul> css: * { // 实际项目中不要用通配符*去设置样式 margin: 0;

2018-05-25

3.3K0

Flex是Flexible Box的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。 .box{ display:flex; display:inline-flex; } Webkit内核的浏览器，必须加上-webkit前缀 .box{ display:-webkit-flex; display: flex; } 解决兼容性问题 .box{ display:-webkit-flex;/*Chrome,Safari,Opera*/ display:-

2018-05-25

1.5K0

display属性，及其区别

标签（空格分隔）：未分类 ---- 所有属性 MDN中所有display的值 /* <display-outside> values */ display: block; display: inline; display: run-in; /* <display-inside> values */ display: flow; display: flow-root; display: table; display: flex; display: grid; display: ruby; display:

2018-05-25

1.3K0

display:none和visibility:hidden的区别

空间占据上的区别如果用文字来描述，简单一句话就是display:none的元素是彻底消失，也就是说该元素的宽度、高度等各种属性值都将“丢失”，不在文档流中占位，浏览器也不会解析该元素；而visibility:hidden只是视觉上消失了，可以理解为透明度为0（opacity:0）的效果，它仍具有高度、宽度等属性值，因此在文档流中占位，浏览器会解析该元素。因此，我们可以知道display:none的元素隐藏后不占据额外空间，状态切换会产生回流和重绘，而visibility:hidden的元素虽然隐藏了，但

2018-05-25

1.8K0

CSS选择器的优先级

要讲CSS选择器的优先级，我们首先要知道CSS选择器有哪些？具体可以参考CSS 选择器参考手册，同时我们还需要知道CSS选择器的解析原则。请阅读为什么CSS选择器是从右往左解析。在此只为各位列出最常用的几种选择器：标签选择器(如：body,div,p,ul,li) 类选择器(如：class="head",对应css选择器为 .head) ID选择器(如：id="name",对应css选择器为 #name) 组合选择器(如：.head .head_logo,注意两选择器用空格键分开) 后代选择器 (如：#

2018-05-25

9130

CSS盒子模型

前言盒子模型（box model）是css中的一个重要概念，它是元素大小的呈现方式 every element in web design is a rectangular box 正文下面

2018-05-25

1.3K0

CSS常见布局

前言在前端开发中，无论是过去，现在，甚至将来，页面布局一直是极为重要的一环，良好的布局方案往往能给用户带来舒适的体验。这篇文章便介绍一些常见的布局方式及其实现。一：两栏布局两栏布局常见于那些一

2018-05-25

1.3K0

为什么要使用css-sprite

什么是Css sprite？ Css sprite：又被称为Css精灵，它是一种性能优化技术，它将多个图像合并到一个通常被称为雪碧图的图像中。 Sprint通过减少呈现网络所需的下载次数来减少网络堵塞。在一个网站里，每一个图片通常储存在一个单独的文件中，其中的一些图片可能是相关的，或者是同一个图片的变体，例如一个按钮在普通状态和高亮状态下使用的两个不同的图片。当用户打开网络时，他们的浏览器必须一个一个的请求这些图片，这样便可能导致页面呈现较慢。然而使用CSS Sprite,多个图片被整合到一个精灵图中，

2018-05-25

1.3K0

一、前言具有 BFC 特性的元素可以看作是隔离了的独立容器，容器里面的元素不会在布局上影响到外面的元素，并且 BFC 具有普通容器所没有的一些特性。 BFC 即 Block Formatting Contexts (块级格式化上下文)，它属于上述定位方案的普通流。二、正文下面介绍触发BFC及BFC带来的影响 2.1、触发BFC 只要元素满足下面任一条件即可触发 BFC 特性： * body 根元素 * 浮动元素：float 除 none 以外的值 * 绝对定位元素：po

2018-05-25

4560

@(分享)[seo] ---- 为什么要做SEO 什么是seo 全称： SEO是英文Search Engine Optimization的缩写，中文意译为"搜索引擎优化" 定义：SEO是指在了解搜索引擎自然排名机制的基础上，对网站进行内部及外部的调整优化，改进网站在搜索引擎中的关键词自然排名，获得更多流量，从而达成网站销售及品牌建设的目标。通俗的来说就是优化网站以提高搜索引擎的相关搜索排名，从而达到获取更多流量的技术与过程为什么要做seo 搜索流量质量高：主动搜索的用户基本上都是有相关需求的，这些流

2018-05-24

1.7K0

spa spa全称：single-page application（单页应用）是一种特殊的Web应用。它将所有的活动局限于一个Web页面中，仅在该Web页面初始化时加载相应的HTML、JavaScript、CSS。一旦页面加载完成，SPA不会因为用户的操作而进行页面的重新加载或跳转，而是利用JavaScript动态的变换HTML,从而实现UI与用户的交互。 SPA百度百科最显著的特点：正常情况下，我们会在一个页面中链接到其他的很多个页面，进行页面的跳转，但是如果使用单页面应用的话，我们始终在一个页面中。

2018-05-24

1.7K0

点击加载更多

社区活动

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·干货材料·成员作品最新动态