如何在一个网站或者一个页面规划JS
规划主要分为两部分:1.JS的分层,2.Js的规划
1.JS的分层(功能)
1-1.底层的库 : jquery
1-2.组件(ui) : 比如拖拽等,模块之间没有必然的联系,可以重复利用
1-3.应用 : 逻辑部分
2.js的规划(管理)
避免全局和方法,可以采用命名空间,闭包, 面向对象的写法.便于管理.模块化 (seaJs,requireJs)我们可以用数轴来比喻规划,X轴是功能,Y轴是管理.比如图书馆,这个图书馆的每一层书是不一样的,这就好比是我们X轴功能的区分,图书馆的每一层书如何摆放,是放书架上还是桌子上,这些是
通过规划书籍来完善的,这就好比Y轴的管理.
用命名空间做案例:
先定义一个总的命名空间,然后给它添加多个属性名,这些属性名都是不同的功能模块.最后在window.onload中调用即可.
window.onload = function(){
mv.app.toTip();
};
var jd = {};
mv.tools={}; //
mv.ui={}; //可以复用的效果加到这里,比如输入框鼠标失去,获得焦点,下面以textChange举例
mv.ui.textChange=function(obj,str){//输入框效果
obj.onfocus = function(){
if(this.value == str){
this.value = "";
};
};
obj.onblur = function(){
if(this.value == ""){
this.value = str;
};
};
};
mv.app={};
mv.app.toTip = function(){
mv.ui.textChange(oDiv1,"请输入要搜索的");
};
如何在一个网站或者一个页面规划JS的更多相关文章
- 如何在一个网站或者一个页面,去书写你的JS代码
// JavaScript Document //如何在一个网站或者一个页面,去书写你的JS代码: //1.js的分层(功能) : jquery(tools) 组件(ui) 应用(app), mvc( ...
- 如何在一个网站或者页面写js
如何在一个网站或者页面写js: 1. JS的分层(功能):jquery(tools) 组件(ui) 应用(app).mvc(backboneJS) 2. JS的规划(管理):避免全局变量和方法(命 ...
- 用js把数据从一个页面传到另一个页面
用js把数据从一个页面传到另一个页面的层里? 如果是传到新页面的话,你网站基于什么语言开发直接用get或者post获取,然后输出到这个层 通过url传参 如果是HTML页面的话JS传到新页面就wind ...
- JavaScript网站设计实践(七)编写最后一个页面 改进表单
一.最后一个页面 contact.html.改进表单 在该页面实现的功能: 几乎所有的网站都会有表单填写,对于用户输入和填写的数据,首先我们一般现在前台验证,然后再去后台验证. 在前台最简单的验证:检 ...
- 纯JS焦点图特效(可一个页面多用)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 【真的是随笔】如何利用htaccess把网站流量引到一个页面上(站点维护页效果)
咕咕咕,好久没来博客园转悠了,最近(这个最近好长啊)一直没时间写博(事实上也不知道写点什么有逼格的东西),所以一直都在潜水,,,(此处省略n字) 好了切入正题,关于如何把网站的所有流量引向一个页面的方 ...
- [HTML]js实现页面跳转,页面A跳到另一个页面B.以及页面传值(中文)
要实现从一个页面A跳到另一个页面B,js实现就在A的js代码加跳转代码 JS跳转大概有以下几种方式: 第一种:(跳转到b.html)<script language="javascri ...
- 用原生js实现一个页面乘法口诀表
今天我自己用js实现了一个页面乘法口诀表(如图)来共享给大家,做的不是很好,如果大家有新的想法可以跟我交流哦. 代码如下: <!doctype html><html lang=&qu ...
- js实现把一个页面层数据传递到另一个页面
由于之前面试,被问到过此问题,所以今天特意整理了一下.由于自己技术水平有限,若存在错误,欢迎提出批评. 本博客整理了两种方式从一个页面层向另一个页面层传递参数. 一. 通过cookie方式 1. 传递 ...
随机推荐
- php : 工厂类演示
工厂类的目的: 通过类名, 动态创建该类的对象实例 <?php /* * 工厂类演示 */ class A{} class B{} // 工厂类: 有一个静态方法,通过该方法,能够获得指定类的对 ...
- 跨站脚本 XSS<一:介绍>
*XSS 利用的是用户对指定网站的信任,CSRF 利用的是网站对用户网页浏览器的信任 跨站脚本(Cross-site scripting,通常简称为XSS)是一种网站应用程序的安全漏洞攻击,是代码注入 ...
- Deep Learning 8_深度学习UFLDL教程:Stacked Autocoders and Implement deep networks for digit classification_Exercise(斯坦福大学深度学习教程)
前言 1.理论知识:UFLDL教程.Deep learning:十六(deep networks) 2.实验环境:win7, matlab2015b,16G内存,2T硬盘 3.实验内容:Exercis ...
- 【java基础】方法2
让形参可变的方法 jdk1.5之后,java允许定义形参长度可变的参数,允许为方法指定数量不确定的形参. package object; public class VariableParam { // ...
- Android 四大组件之三(广播)
1.Android广播机制概述 Android广播分为两个方面:广播发送者和广播接收者,通常情况下,BroadcastReceiver指的就是广播接收者(广播接收器).广播作为Android组件间的通 ...
- mac下使用brew安装ffmpeg支持x265
使用brew install ffmpeg 安装ffmpeg默认是没有支持x265的, 使用brew info ffmpeg 获取安装选项帮助, 使用brew reinstall ffmpeg --w ...
- Using Spring Boot without the parent POM
Using Spring Boot without the parent POM: 问题 spring boot项目一般情况下的parent如下: <parent> <groupId ...
- Android开发--ImageView的应用
1.简介 当要在屏幕上显示图片时,ImageView用于创建显示图片所需的对象.另外,通过设置ImageView可以改变图片的有关属性. 2.构建 使用Images & Media中的部件来实 ...
- Linux字符设备
一.linux系统将设备分为3类:字符设备.块设备.网络设备. 字符设备:是指只能一个字节一个字节读写的设备,不能随机读取设备内存中的某一数据,读取数据需要按照先后数据.字符设备是面向流的设备,常见的 ...
- SAP常用命令及BASIS操作
Pfcg 角色,权限参数文件配置Su53 查看权限对象 st01 跟踪St22 看dump,以分析错误 eg.找到ABAP程序出错的地方,找出fou ...