摘要： 如何优雅的设计 React 组件 如今的 web 前端已被 React、Vue 和 Angular 三分天下，一统江山十几年的 jQuery 显然已经很难满足现在的开发模式。那么，为什么大家会觉得 jQuery “过时了”呢？一来，文章《 "No JQuery! 原生 JavaScript 操作 D 阅读全文

摘要： 舒适的前端开发环境是怎样一种体验 去年一篇 "《在 2016 年学 JavaScript 是一种什么样的体验？》" 吓坏了很多想要入行新同学和入行很久的老司机，感觉一下子前端世界已经看不懂了，做个页面要那么麻烦？当然如果你只是想要一个简单的静态页面，这么玩儿就是杀鸡用牛刀了。但如果你准备开发一个we 阅读全文

摘要： 我经历的前端开发模式进化史 萌芽 记得，在刚接触js那会儿，那时还没有专职的“前端开发”。当时的前端开发工作是由设计师（当时还叫“美工”）来完成的，在这种模式下，设计师需要完成页面的设计、切图、css、html，以及部分js交互的工作。这些完成的工作会成为设计资源的一部分被一并提供给开发人员，由于设 阅读全文

摘要： 重启 偶然闲来无事，看了下之前在cnblogs上的随笔，发现最后一篇的发布日期已经距离现在有5年之久。想想这5年，一幕幕的经历就在眼前，但唯一不变的是对前端技术的热爱。 不过这几年前端技术却一刻不停的在变化和发展，特别是这2年，变化快的简直令人发指。如果你是个仍然在一线工作的老兵，如果你仍然守住之前 阅读全文

摘要： 最近突然来了兴趣，把很久前写的Ajax请求状态管理器重构了下，随后写了篇介绍小文与大家分享了。然后，又把我的博客改版了下，有时候发现之前喜欢的样式，慢慢会看厌了，就花了时间改观改观吧。今天我想介绍一个大家在平日里会经常遇到的一个问题--图片在容器中的居中。图片在容器中水平及垂直居中其实很简单，甚至可以只通过CSS就能搞定。例如用display: table;，然后在图片外加个容器，定义display: table-cell; vertical-align: middle; text-align: center;，如果再需要限制图片的大小以防超出到容器之外，只要定义上max-width和max- 阅读全文

摘要： 现在的网站，在一个网页中有异步请求甚至许多个异步请求已经不足为奇。Ajax已经成为了现在网站必须的基本功能，使网页应用更接近于桌面应用。 然而，无论有多么接近，通过客户端与服务端的一来一回，必定会有等待加载数据的时间。所以，大多数网站都通过一个Gif动态图标或‘Loading...’等字样来告知用户数据还在加载中。但有时候这个问题会非常繁琐和麻烦，要么将这个‘Loading’显示在ajax请求之前，然后在ajax成功后隐藏它，或者将它写在jquery的ajax的全局事件jQuery.ajaxStart()和jQuery.ajaxStop()中来控制整个页面的ajax状态。前者方法... 阅读全文

摘要： 键盘字符英文`backquote~tilde!exclam@at#numbersign$dollar%percent^caret&ampersand*asterisk(parenleft)parenright-minus_underscore=equal+plus[bracketleft{braceleft]bracketright}braceright;semicolon:colon'quote"doublequote\backslash|bar,comma<less.period>greater/slash?questionspace 阅读全文

摘要： 前端开发人员经常会用到“!important”声明样式属性，来提升指定样式规则的应用优先权。很多人也喜欢使用这一特性来区分浏览器之间的兼容性差异，特别是IE6。然而，很少人知道IE6其实是支持这一特性的，只不过用法不同。先看下面的示例：div { background: #000 !important; background: #f00;}以上代码的结果是IE6下为红色，其他浏览器为黑色。这也是原先认为IE6不支持“!important”的原因，久而久之，大家都使用hank来处理这一问题。但是，如果改成这样定义样式：div { background: #000 !important;}div 阅读全文

摘要： 我们经常会对a链接的display设置为block，以便整个标签可以点击。但是，如果对该标签设置为position:absolute后，会发现在ie6、ie7下有时点击无效，ie8下有效（ie8标准），使用zoom:1方式也无法解决问题。解决方案使用position:relative而不是position:absolute；添加背景色；添加透明的背景图片，gif或png，但会增加无意义的http请求；使用background:url(about:blank)，*最佳方案。 阅读全文

摘要： 强制不换行p { white-space:nowrap; }自动换行p { word-wrap:break-word; word-break:normal; }强制英文单词断行p { word-break:break-all; }*注意：设置强制将英文单词断行，需要将行内元素设置为块级元素。span { display:block; } 阅读全文