Category: 前端

  • Spring REST Controller,在 GET 方式下,有多个参数时的处理

    现在越来越多的服务都转向使用 RESTful 了,我们的项目也不例外,使用 spring 来做了 REST。在采用 RESTful 的时候,我们会严格按照约定来使用 HTTP METHOD: 本来,按照这种方式来做的时候,开发都很方便。不过,最近遇到一个问题:

  • jQuery 中的选择器问题 -$(A.B>C [D=’E’]) 的 DOM 结构

    这个题目比较简单,平常用 jQuery 查询匹配 DOM 元素的时候,没有写过这种形式: 画出 Html 中的 DOM 结构,这题目真是帮助不少的。 这题目难在 Html 的标签不是常规的,我平常没有适应这种转换思路,这里作为标记!

  • 如何去除 html 代码标签之间换行产生的空格

    当使用 inline-block 时,HTML 元素之间的空白会显示在页面上,为了保持代码的美观,不建议使用全部写在一行内或者影响美观的方法。 推荐方法:在父元素上设置 font-size: 0; 例子: 效果预览:  修改后代码: 效果预览: 

  • 现代 Web 发展趋势和前沿技术综述

    本文的叙述过程分为两个部分,第一部分是现代 Web 发展趋势,第二部分是 Web 的前沿技术综述。现在先来阐述第一部分:现代 Web 发展趋势。 现代 Web 发展趋势 从网络在不同的发展阶段扮演的角色,现代 Web 发展阶段可以简单地分类为 Web1.0、Web2.0、Web3.0。Web1.0 中,网络是信息的提供者,单向性的提供和单一性理解;Web2.0 中,网络是平台,用户提供信息,通过网络,其他用户获取信息;Web3.0 中,网络成为用户需求理解和提供者,网路对用户了如指掌,知道用户有什么、要什么以及行为习惯,进行资源筛选、智能匹配,直接给出答案。 web1.0 的特征 Web1.0 类型的网站的口号是 “内容为王”,网站的目标是用内容来吸引眼球。这种思想也是传统媒体思想的一种延续。但是,在网络中,人与内容之间的关系常常受到超链接等外部因素的干扰,因而呈现出偶然性、随意性与跳跃性,而信息超载也使得内容对于人的持续吸引力不断减弱。也就是说,在网络中,人与内容的关系往往是不稳定的。有时,反倒是形式(例如界面风格)对人们在网络中的行为方式产生较强的制约作用。 Web2.0 的特征 Web2.0 则试图把人与内容的关系深化为人与人的关系。Web2.0 指的是一个利用 Web 的平台,由用户主导而生成的内容互联网产品模式,为了区别传统由网站雇员主导生成的内容而定义为第二代互联网。Web2.0 中,用户参与网站内容制造,网站的内容通常是用户发布的,使得用户既是网站内容的浏览者也是网站内容的制造者,这也意味着 Web2.0 网站为用户提供了更多参与的机会。Web2.0 是互联网的一次理念和思想体系的升级换代,由原来的自上而下的由少数资源控制者集中控制主导的互联网体系,转变为自下而上的由广大用户集体智慧和力量主导的互联网体系。 Web3.0 的特征 Web3.0 最大的特点在于信息的聚合以及提供个性化的信息服务,真正的 Web3.0 时代不仅仅是按照用户需求提供综合化服务,创建综合化服务平台,更关键的是,提供基于用户偏好的个性化聚合服务。例如,搜索引擎的个性智能化,用户不用分析和试验如何组合关键词语,只要把想要的东西列出,与个人的偏好和背景连接,搜索引擎就能把适合的数据提供出来,更快捷地搜索信息,解决问题,同时用户可以自由定制搜索聚合结果。Web 致富 Tim Bernerslee 提出 “Web3.0 is something called the semantic web (语义网)”,语义网是指将全部的信息、资源、知识分散各地,以内容的形式连接成网。Web2.0 的信息通过 Web 程序中的标识代码实现站内互通,而 Web3.0…

  • Node.js 机制及原理理解初步

    Node.js 优缺点 Node.js 是单进程。 好处就是: 反之,看 PHP 对比,Node.js 的处理: 坏处就是: 如何解决高并发? node 使用异步 IO 和事件驱动(回调函数)来解决这个问题。 一般来说,高并发解决方案会提供多线程模型,为每个业务逻辑提供一个线程,通过系统线程切换来来弥补同步 I/O 调用的时间开销。像 apache,是一个请求一个线程。 而 node.js 使用的是单线程模型,对所有 I/O 都采用异步的请求方式,避免频繁的上下文切换,在 node.js 执行的时候维护着一个事件队列;程序在执行时进入事件循环等待下一个事件到来,每个异步 I/O 请求完成后都会被推送到事件队列中的等待执行。 比如说: 对于一个简单的数据库访问操作,传统方式是这样实现的:  代码执行到第一行的时候线程会阻塞,等待 query 返回结果,然后继续处理。由于数据库查询、磁盘读写、网络通信等原因(所谓的 I/O)阻塞时间会非常大(相对于 CPU 始终频率)。对于高并发的访问,一方面线程长期阻塞等待,另一方面为了应付新情求而不断添加新线程,会浪费大量系统资源,同时线程的增加也会也会占用大量的 CPU 时间来处理内存上下文切换。看看 node.js 怎么处理: query 的第二个参数是一个回调函数,进程执行到 db.query 的时候不会等待结果返回,而是直接继续执行下面的语句,直到进入事件循环。当数据库执行结果返回的时候会将事件发送到事件队列,等到线程进入事件循环后才会调用之前的回调函数。 node.js 的异步机制是基于事件的,所有的 I/O、网络通信、数据库查询都以非阻塞的方式执行,返回结果由事件循环来处理。node.js 在同一时刻只会处理一个事件,完成后立即进入事件循环检查后面事件。这样 CPU 和内存在同一时间集中处理一件事,同时尽量让耗时的 I/O 等操作并行执行。 事件循环机制 所谓事件循环是指 node.js…

  • NPM 使用介绍

    NPM 是随同 NodeJS 一起安装的包管理工具,能解决 NodeJS 代码部署上的很多问题,常见的使用场景有以下几种: 由于新版的 nodejs 已经集成了 npm,所以之前 npm 也一并安装好了。同样可以通过输入 “npm -v” 来测试是否成功安装。命令如下,出现版本提示表示安装成功: 如果你安装的是旧版本的 npm,可以很容易得通过 npm 命令来升级,命令如下: 使用 npm 命令安装模块 npm 安装 Node.js 模块语法格式如下: 以下实例,我们使用 npm 命令安装常用的 Node.js web 框架模块 express:  安装好之后,express 包就放在了工程目录下的 node_modules 目录中,因此在代码中只需要通过 require(‘express’) 的方式就好,无需指定第三方包路径。 全局安装与本地安装 npm 的包安装分为本地安装(local)、全局安装(global)两种,从敲的命令行来看,差别只是有没有 – g 而已,比如 如果出现以下错误: 解决办法为: 本地安装 全局安装 如果你希望具备两者功能,则需要在两个地方安装它或使用 npm link。 接下来我们使用全局方式安装 express  安装过程输出如下内容,第一行输出了模块的版本号及安装位置。 查看安装信息 你可以使用以下命令来查看所有全局安装的模块: 如果要查看某个模块的版本号,可以使用命令如下: 使用 package.json package.json…

  • 悟透 JavaScript

    引子     编程世界里只存在两种基本元素,一个是数据,一个是代码。编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力。     数据天生就是文静的,总想保持自己固有的本色;而代码却天生活泼,总想改变这个世界。    你看,数据代码间的关系与物质能量间的关系有着惊人的相似。数据也是有惯性的,如果没有代码来施加外力,她总保持自己原来的状态。而代码就象能量,他存在的唯一目的,就是要努力改变数据原来的状态。在代码改变数据的同时,也会因为数据的抗拒而反过来影响或改变代码原有的趋势。甚至在某些情况下,数据可以转变为代码,而代码却又有可能被转变为数据,或许还存在一个类似 E=MC2 形式的数码转换方程呢。然而,就是在数据和代码间这种即矛盾又统一的运转中,总能体现出计算机世界的规律,这些规律正是我们编写的程序逻辑。     不过,由于不同程序员有着不同的世界观,这些数据和代码看起来也就不尽相同。于是,不同世界观的程序员们运用各自的方法论,推动着编程世界的进化和发展。     众所周知,当今最流行的编程思想莫过于面向对象编程的思想。为什么面向对象的思想能迅速风靡编程世界呢?因为面向对象的思想首次把数据和代码结合成统一体,并以一个简单的对象概念呈现给编程者。这一下子就将原来那些杂乱的算法与子程序,以及纠缠不清的复杂数据结构,划分成清晰而有序的对象结构,从而理清了数据与代码在我们心中那团乱麻般的结。我们又可以有一个更清晰的思维,在另一个思想高度上去探索更加浩瀚的编程世界了。     在五祖弘忍讲授完《对象真经》之后的一天,他对众弟子们说:“经已讲完,想必尔等应该有所感悟,请各自写个偈子来看”。大弟子神秀是被大家公认为悟性最高的师兄,他的偈子写道:“身是对象树,心如类般明。朝朝勤拂拭,莫让惹尘埃!”。此偈一出,立即引起师兄弟们的轰动,大家都说写得太好了。只有火头僧慧能看后,轻轻地叹了口气,又随手在墙上写道:“对象本无根,类型亦无形。本来无一物,何处惹尘埃?”。然后摇了摇头,扬长而去。大家看了慧能的偈子都说:“写的什么乱七八糟的啊,看不懂”。师父弘忍看了神秀的诗偈也点头称赞,再看慧能的诗偈之后默然摇头。就在当天夜里,弘忍却悄悄把慧能叫到自己的禅房,将珍藏多年的软件真经传授于他,然后让他趁着月色连夜逃走…     后来,慧能果然不负师父厚望,在南方开创了禅宗另一个广阔的天空。而慧能当年带走的软件真经中就有一本是《JavaScript 真经》! 回归简单     要理解 JavaScript,你得首先放下对象和类的概念,回到数据和代码的本原。前面说过,编程世界只有数据和代码两种基本元素,而这两种元素又有着纠缠不清的关系。JavaScript 就是把数据和代码都简化到最原始的程度。     JavaScript 中的数据很简洁的。简单数据只有 undefined, null, boolean, number 和 string 这五种,而复杂数据只有一种,即 object。这就好比中国古典的朴素唯物思想,把世界最基本的元素归为金木水火土,其他复杂的物质都是由这五种基本元素组成。     JavaScript 中的代码只体现为一种形式,就是 function。     注意:以上单词都是小写的,不要和 Number, String, Object, Function 等 JavaScript 内置函数混淆了。要知道,JavaScript 语言是区分大小写的呀!     任何一个 JavaScript 的标识、常量、变量和参数都只是 unfined, null, bool, number, string, object 和 function…