在项目中遇到这也一个问题： 有a.html和b.html。 1.a页面已经打开，b页面尚未打开，我希望在a页面设置好一些列参数，比如背景色，宽度等参数，传递给b页面，好让b页面在打开就能应用。 2.a页面已经打开，b页面无论是否打开。在a页面需要获取到b页面的一些元素甚至变量，以便于应用到a页面。 注意：不涉及跨域问题。 想了很久，终于想到了解决方案。 第一个问题，我们可以利用html页面锚点的特性，将参数通过url传递给b页面 这是a页...
首先在学习这门框架前，你需要对以下知识有所了解： 1.原生JS基础 2.CSS基础 3.npm包管理基础 4.webpack构建项目基础 5.ES6规范 以上五个知识点也是目前学习其他前端框架所必须了解的前置任务。JS和CSS就不多说了，npm是目前最提倡也是占据主导地位的包管理工具，还在用bower或者其他工具的童鞋可以考虑下了。而webpack作为新一代打包工具，已经在前端打包工具中独占鳌头，和Browserify相比也有很大优势。...
写了一个测试代码,用require.js配合它的一个插件text.js实现了最简单的单页应用程序,简单的记录一下，方便以后复习, git地址:https://github.com/lily1010/requireSPA 下面来看一下目录从上面项目可以看出,我将css单独抽离出去,实现了按需加载,即加载test1.html时会加载test1.css,加载test2.html时会加载test2.css. 一、先来看入口index.html代码 <!DOCTYPE html> <html><head><meta charset="utf-8" /><title></title><meta name...
写了一个测试代码,用require.js配合它的一个插件text.js实现了最简单的单页应用程序,简单的记录一下,方便以后复习, git地址:https://github.com/lily1010/requireSPA 下面来看一下目录从上面项目可以看出,我将css单独抽离出去,实现了按需加载,即加载test1.html时会加载test1.css,加载test2.html时会加载test2.css. 一 先来看入口index.html代码 <!DOCTYPE html> <html><head><meta charset="utf-8" /><title></title><meta name="v...
前面的话简易日历作为javascript中Date对象的常见应用，用途较广泛，本文将详细说明简易日历的实现思路。效果演示 HTML说明 使用type=number的两个input分别作为年和月的输入控件，这样在高级浏览器下自带调节按钮 按照周日到周一的顺序进行星期的排列<div class="box"><header class=control><input id="conYear" class="con-in" type="number" min="1900" max="2100" step="1"/><input id="conMonth" class="con-in" type="nu...
一、Ajax (Asynchronous JavaScript + XML) 能够像服务器请求额外的数据而无需卸载页面，即局部刷新技术 二、创建一个XHR对象 function createXHR () {if (typeof XMLHttpRequest != "undefined") {return new XMLHttpRequest();} else if (typeof ActiveXObject != "undefined") { // < Ie7 if (typeof arguments.callee.activeXString != "string") {var version = ["MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLH...
本文是requireJS的一些知识点的总结，配上多页面应用中的实例分析。 本案例的目录结构如下： requireJS API的三个主要函数：define（创建模块），require（加载模块），config（配置） 1、 HTML文件中加载JS文件 page1.html内容如下： <!DOCTYPE html> <html> <head> <title>Page 1</title> <script data-main="scripts/page1" src="scripts/lib/require.js"></script> </head> <body> <a href="page2.html">Go to Page 2</a> </bo...
先看看效果图：大家肯定都见过类似效果的网页，怎么实现的呢,代码很简单： <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css"> * { margin:0; padding:0; } div.centent {float:left;text-align: center;margin: 10px; } span { display:block; margin:2px 2px;padding:4px 10px; background:#898989;cursor:pointer;font-size:12px;color:white; } <...
目前仅有高版本的 Chrome 浏览器支持这样直接粘贴，其他浏览器目前为止还无法粘贴,不过火狐和ie11浏览器在可编辑的div中能够粘贴截图的图片也是base64位和Chrome利用clipboardData的效果是一样的，只是在火狐和ie11浏览器中目前还无法实现类似用clipboardData直接获取图片的base64数据，它是自带的直接进去img数据。 完整实例： <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>利用clipboardData在网页...
一、回调函数定义 回调函数就是一个通过函数指针调用的函数。如果你把函数的指针（地址）作为参数传递给另一个函数，当这个指针被用为调用它所指向的函数时，我们就说这是回调函数。回调函数不是由该函数的实现方直接调用，而是在特定的事件或条件发生时由另外的一方调用的，用于对该事件或条件进行响应。 在JavaScript中，回调函数具体的定义为：函数A作为参数(函数引用)传递到另一个函数B中，并且这个函数B执行函数A。我们就说函...
Mutable 对象 在 JavaScript 中，对象是引用类型的数据，其优点在于频繁的修改对象时都是在原对象的基础上修改，并不需要重新创建，这样可以有效的利用内存，不会造成内存空间的浪费，对象的这种特性可以称之为 Mutable，中文的字面意思是「可变」。 对于 Mutable 的对象，其灵活多变的优点有时可能会成为其缺点，越是灵活多变的数据越是不好控制，对于一个复杂结构的对象来说，一不小心就在某个不经意间修改了数据，假如该对象又在...
废话不多说了，直接给大家贴代码了，具体代码如下所示： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>延时显示提示框</title> <style> #div1 { float: left; width: 60px; height: 60px; background-color: aqua; } #div2 { position: relative; float: left; margin: 0 10px; width: 200px; height: 200px; background-color: #cccccc; display: none; } </style> <script> window.onload = function...
本次的目的是搭建一个最基础的可以实现功能的NodeJS服务器，能够体现出NodeJS的工作流程以及开发的基本框架。 需求：已经安装了nodejs以及express。 一、构建基础的NodeJS服务器（express、路由）var express = require(‘express); //引入express模块 var app = express(); //调用express()函数，对函数进行初始化 app.get(/stooges/:name?, function(req, res, next){ //设置第一个路由，期待一个name被输入 var name = req.pa...
NodeJS是一个服务器端JavaScript解释器，它将改变服务器应该如何工作的概念。它的目标是帮助程序员构建高度可伸缩的应用程序，编写能够处理数万条同时连接到一个（只有一个）物理机的连接代码。 Node.js 受益于它的事件驱动和异步的特征，已经很快了。但是，在现代网络中只是快是不行的。如果你打算用 Node.js 开发你的下一个Web 应用的话，那么你就应该无所不用其极，让你的应用更快，异常的快。本文将介绍 10 条，经过检验得知可...
之前文章中也讲了一下拖拽的基本思想，理论是有了，那实践呢，可以运用到什么地方呢？下面就给大家带来一个用拖拽思想写的一个小实例，供大家参考，大致效果看下图：就是这样一个简单的一个拖拽条，你可以把它理解为滚动条，也可以理解为表单中的数量选择控件，也可以理解为进度条，等等，反正你可以改成很多你想要的效果，废话不多说，我们来看看这个是怎么做的吧！ 想了想，感觉原理就不用说了吧，我在拖拽效果中就已经说的很清楚...