20161023 前端开发周报

关于css定位,你需要知道的5件事;微信小程序之知乎日报;JavaScript 中的类和继承;为什么我不想成为Web前端程序员;一次完整的HTTP请求过程;HTML5,不只是看上去很美(第四弹:可交互地铁线路图);CSS 命名管理混乱?不妨试试 BEM;CSS中一些利用伪类、伪元素和相邻元素选择器的技巧

  1. 李松峰(432次阅读/2次分享/2次评论/2次点赞)

    关于css定位,你需要知道的5件事 (by cherryvenus – 众成翻译):近年来前端工程师已经可以通过不同的css布局技巧制作出很复杂的布局。其中有些技巧有很长的历史(比如:floats),也有一些是近几年才被青睐的(比如flexbox)。在这篇文章中,我们会更加细致地探…..
  2. 稀土掘金(280次阅读/2次分享/2次评论/2次点赞)

    微信小程序之知乎日报 – 由于知乎日报是一个资讯类的 App,UI 的布局主要是以资讯列表页、资讯详情页和评论页为主,当然本次也附带了应用设置页,不过现阶段功能尚未编写,过段时间会更新补充,继续完善。 分享 by @迪鲁宾 | 查看全文:
  3. 实验楼官方微博(269次阅读/2次分享/2次评论/2次点赞)

    #编程技术分享#【JavaScript 中的类和继承】文章主要介绍了JavaScript中类的实现、继承的实现,希望对前端开发者有所帮助,[围观] 全文:

    JavaScript 中的类和继承
  4. JAVA大本营(204次阅读/2次分享/2次评论/2次点赞)

    为什么我不想成为Web前端程序员 职位名称并不代表技能集 作为一个前端开发人员,你是不是认为自己不需要懂很多技能?然而事实可能并非如此。 我在一个热门的工作论坛就前端开发工作做了一个快速搜索,发现有一个主题经常反复出现,那就是成为中级/高级前端开发者需要什么技能: (X)HTML(5)、CSS、SASS / SCSS,LESS。 Backbone、Angular、Knockout。 响应式网页设计(例如Bootstrap知识、Foundation等)。 Ad..

    为什么我不想成为Web前端程序员
  5. 全栈开发者(167次阅读/11次分享/2次评论/6次点赞)

    一次完整的HTTP请求过程 】全文=>一次完整的HTTP请求所经历的7个步骤HTTP通信机制是在一次完整的HTTP通信过程中,Web浏览器与Web服务器之间将完成下列7个步骤: 1. 建立TCP连接在HTTP工…

    一次完整的HTTP请求过程
  6. SegmentFault(159次阅读/26次分享/3次评论/18次点赞)

    HTML5,不只是看上去很美(第四弹:可交互地铁线路图)】能拖能拽,还和电子地图做了交互……文章传送门:前言 最近特别忙,承蒙大伙关照,3D机房的项目一个接着一个,领了一帮小弟,搞搞传帮带,乌飞兔走,转眼已经菊黄蟹肥……有个小弟很不错,勤奋好学,很快就把API都摸透了,国庆几天自己折腾着做了个HTML5的魔都的地…

    HTML5,不只是看上去很美(第四弹:可交互地铁线路图)
  7. 稀土掘金(130次阅读/5次分享/6次评论/8次点赞)

    CSS 命名管理混乱?不妨试试 BEM – 我们知道,css 使用中一个比较令人烦恼的问题,就是 css 没有作用域可言,我们写了一个组件或者模块之后,往往希望它们可以四处复用,但是由于 css 没有作用域,我们给样式命名的时候都会非常小心,因为害怕命名重复导致组件的样式被覆盖。于是 全文
  8. 程序员俱乐部(101次阅读/2次分享/2次评论/2次点赞)

    CSS中一些利用伪类、伪元素和相邻元素选择器的技巧 前几天遇到一个页面需求是这样的: 一个评论框,后面的按钮有点赞或者发送评论两种状态,其中发送按钮有根据输入框中是否有字分为可点击和不可点击两种状态。 需求: 没有文字,没有聚焦——点赞 没有文字,聚焦——灰色发送 有文字——红色发送 如果用JS实现,需要监听输入框的change和focus事件,比较麻烦。但是用CSS中的伪类就可以实现相近效果。 <input type='text' class='input' requ..

    CSS中一些利用伪类、伪元素和相邻元素选择器的技巧
  9. 程序员俱乐部(101次阅读/18次分享/4次评论/14次点赞)

    2016 年 7 个顶级 JavaScript 框架 当涉及到Web开发时,JavaScript框架往往是一些开发人员和企业最受欢迎的平台。可能,你有机会尝试过一两个顶级的JavaScript框架,但你仍然有点不确定哪个才是最佳的最值得掌握的,或者哪个值得你建议你的开发人员选择用于下一个web开发项目。 JavaScript正在以惊人的速度前进,并且添加新的技能到你的存储库变得有不断的压力。为了做到这一点,知道和了解更多的顶级JavaScript框架在现在看来是必要的。在ValueCod..

    2016 年 7 个顶级 JavaScript 框架
  10. LUPA开源社区(98次阅读/2次分享/2次评论/2次点赞)

    这些废弃的HTML标签不要用】HTML 已经发展了多年,现在 W3C 已经发布了 HTML 5.1 的提案推荐标准,一些陈旧废弃的标签已经在后继的标准中逐渐消失。这里为大 …
  11. 前端大全(97次阅读/26次分享/10次评论/20次点赞)

    更快学习 JS 的 6 个简单思维技巧》这篇文章描述了6个思维技巧,将帮助你更快地学习JavaScript,让你成为一个幸福和高效的编码者。(cathyhu916 译

    更快学习 JS 的 6 个简单思维技巧
  12. 全栈开发者(92次阅读/2次分享/2次评论/2次点赞)

    JavaScript 数组中的 indexOf 方法详解】全文=>5个现在就该使用的数组Array方法: indexOf/filter/forEach/map/reduce详解…io.js新图标logo征集中 在JavaScript的Array数组中调用一组Function方法 WebPack…

    JavaScript 数组中的 indexOf 方法详解
  13. 全栈开发者(91次阅读/21次分享/7次评论/17次点赞)

    MVC 在前端已死? 】随着越来越多的前端开发开勇单项数据流架构,有些人就开始考虑传统的 MVC 是否还有未来?为了便于理解,我们首先分析一下前端架构的发展史。全文=>随着越来越多的前端开发开勇单项数据流架构,有些人就开始考虑传统的 MVC 是否还有未来?为了便于理解,我们首先分析一下前端架构的发展史。 在过去的 4 …

    MVC 在前端已死
  14. 李松峰(68次阅读/2次分享/2次评论/2次点赞)

    Vue.js 2.0新增的虚拟DOM是怎么回事? (by QAQMiao – 众成翻译):你可能早就已经听说了 Vue.js 2.0。一个主要的令人兴奋的新特性就是更新页面的虚拟DOM的加入。虚拟 DOM 可以做什么?React 和 Ember 都使用了虚拟DOM来提升页面的刷新……
  15. IT程序狮(68次阅读/2次分享/2次评论/2次点赞)

    #前端开发那些事#【Javascript 鼠标拖动面板的制作】详见:Javascript鼠标拖动面板的制作【思路及注意点】 在这篇文章,我们将随作者来看看,如何利用 Javascript 实现鼠标拖动面板的效果。作者将分享其实现思路以及相关注意要点。[围观]【前端开发那些事】专辑,欢迎你来投稿。[来]先来看看效果:拖动面板演示效果 HTML结构很简单,一个大的div包含三个小的div 如图: 然后开始思考如何来写鼠标拖动实现的代码。 点击到标题才能拖动. 标题被点击后,触发点击事件,同时给点击事件绑定鼠标移动事件。 当鼠标移动时,将面板也按照鼠标的位置进行移动。 鼠标松开后,清空鼠标移动事件。 这是大方向的思路,然后我们细化一下。 标题被点击,首先要获取到class=”text”的第一个元素,设置onclick事件。 绑定的鼠标移动事件中,首先得到鼠标的位置,然后得到面板的位置,需要进行一点运算看看让面板怎样移动,这个后面会详解。 对于最后清空鼠标移动事件:标题鼠标松开时触发onm…

    Javascript 鼠标拖动面板的制作

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流