window.js 主要包含了页面的一些操作


Posted in Javascript onDecember 23, 2009
//处理页面异常 
function Exception() { 
} //页面元素共同接口 
function View() { 
//页面元素 
this.element = null; 
//文字颜色 
this.color = null; 
//设置样式 
this.setStyle = function(name, value) { 
eval("this.element.style." + name + " = '" + value + "'"); 
} 
//获取样式 
this.getStyle = function(name) { 
return eval("this.element.style." + name); 
} 
//设置浮动样式 
this.setFloat = function(styleFloat) { 
this.setStyle("styleFloat", styleFloat); 
} 
//设置背景色 
this.setBackgroundColor = function(backgroundColor) { 
this.setStyle("backgroundColor", backgroundColor); 
} 
//获取背景色 
this.getBackgroundColor = function() { 
return this.getStyle("backgroundColor"); 
} 
//设置对象宽度 
this.setWidth = function(width) { 
//alert(width); 
this.setStyle("width", width); 
} 
//设置对象宽度 
this.setHeight = function(height) { 
this.setStyle("height", height); 
} 
//设置页面定位 
this.setPosition = function(position) { 
this.setStyle("position", position); 
} 
//设置层 
this.setZIndex = function(zIndex) { 
this.setStyle("zIndex", zIndex); 
} 
//左边距离 
this.setLeft = function(left) { 
this.setStyle("left", left); 
} 
//上边距离 
this.setTop = function(top) { 
this.setStyle("top", top); 
} 
//是否换行 
this.setWhiteSpace = function(whiteSpace) { 
this.setStyle("whiteSpace", whiteSpace); 
} 
this.setMargin = function(margin) { 
this.setStyle("margin", margin); 
} 
this.setPadding = function(padding) { 
this.setStyle("padding", padding); 
} 
//设置属性 
this.setAttributeIsHave = function(attrName, value) { 
eval("this.element.setAttribute('" + attrName + "', '" + value + "')"); 
} 
this.setId = function(id) { 
this.setAttributeIsHave("id", id); 
} 
this.setInnerText = function(innertext) { 
this.setAttributeIsHave("innerText", innertext); 
} 
//加入自定义属性 
this.setAttributeIsNot = function(attrName, value) { 
var attr = document.createAttribute(attrName); 
attr.value = value; 
this.element.setAttributeNode(attr); 
} 
//事件监听 
this.eventListener = function(eventName, exec) { 
this.element.attachEvent(eventName, exec); 
} 
//鼠标移入对象事件 
this.onmouseenterListener = function(exec) { 
this.eventListener("onmouseenter", exec); 
} 
//鼠标移出对象事件 
this.onmouseleaveListener = function(exec) { 
this.eventListener("onmouseleave", exec); 
} 
//鼠标单击对象事件 
this.onclickListener = function(exec) { 
this.eventListener("onclick", exec); 
} 
} 
//单一元素 
function Single() { 
View.call(this); 
} 
//可以有子元素 
function Multi() { 
View.call(this); 
//子元素集合 
this.childElementList = new Array(); 
//加入子元素 
this.addView = function(childElement) { 
if(this.element == null) { 
//待加入异常信息 
return; 
} 
this.childElementList[this.childElementList.length] = childElement; 
} 
//关联子元素 
this.appendChildElement = function(childElement) { 
this.element.appendChild(childElement.element); 
} 
//显示元素 
this.show = function() { 
for(var i = 0; i < this.childElementList.length; i++) { 
var childElement = this.childElementList[i]; 
this.appendChildElement(childElement); 
childElement.show(); 
} 
} 
} 
//面板 
function Panel() { 
Multi.call(this); 
//创建页面元素 
this.element = document.body; 
} 
//行布局 
function LineLayout() { 
Multi.call(this); 
this.element = document.createElement("div"); 
} 
//左布局 
function LeftLayout() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setFloat("left"); 
} 
//右布局 
function RightLayout() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setFloat("right"); 
} 
function Menu() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setWidth("100%"); 
var clickListener = function() { 
return; 
}; 
var moveInBackgroundColor = "red"; 
var moveOutBackgroundColor = this.getBackgroundColor(); 
this.show = function() { 
var menuItem = null; 
var menuEntiy = null; 
for(var i = 0; i < this.childElementList.length; i++) { 
menuItem = new MenuItem(); 
menuEntiy = this.childElementList[i]; 
menuItem.addMenuEntity(menuEntiy); 
menuItem.onmouseenterListener(moveInMenuItem); 
menuItem.onmouseleaveListener(moveOutMenuItem); 
menuItem.onclickListener(this.clickMenuItem ); 
menuItem.setPadding("0 5px 0 5px"); 
this.appendChildElement(menuItem); 
} 
} 
this.setClickListener = function(exec) { 
clickListener = exec; 
} 
function moveInMenuItem() { 
event.srcElement.style.backgroundColor = moveInBackgroundColor; 
} 
function moveOutMenuItem() { 
event.srcElement.style.backgroundColor = moveOutBackgroundColor; 
} 
this.clickMenuItem = function() { 
var child = clickListener(); 
document.body.appendChild(child.element); 
child.setLeft(event.srcElement.offsetLeft); 
child.setTop(event.srcElement.offsetParent.offsetTop + event.srcElement.clientHeight); 
child.show(); 
} 
} 
function ChildMenu() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setPosition("absolute"); 
this.setZIndex(100); 
this.setBackgroundColor("#ccffcc"); 
var moveInBackgroundColor = "red"; 
var moveOutBackgroundColor = this.getBackgroundColor(); 
this.show = function() { 
var menuItem = null; 
var menuEntiy = null; 
for(var i = 0; i < this.childElementList.length; i++) { 
menuItem = new MenuItem(); 
menuItem.setFloat("none"); 
menuEntiy = this.childElementList[i]; 
menuItem.addMenuEntity(menuEntiy); 
menuItem.onmouseenterListener(moveInMenuItem); 
menuItem.onmouseleaveListener(moveOutMenuItem); 
//menuItem.onclickListener(clickMenuItem); 
menuItem.setPadding("0 5px 0 15px"); 
this.appendChildElement(menuItem); 
} 
} 
function moveInMenuItem() { 
event.srcElement.style.backgroundColor = moveInBackgroundColor; 
} 
function moveOutMenuItem() { 
event.srcElement.style.backgroundColor = moveOutBackgroundColor; 
} 
} 
function MenuEntiy(id, name, action) { 
this.id = id; 
this.name = name ; 
this.action = action; 
} 
function MenuItem() { 
Single.call(this); 
this.element = document.createElement("div"); 
this.setFloat("left"); 
this.setWhiteSpace("nowrap"); 
this.addMenuEntity = function(menuEntity) { 
this.setId(menuEntity.id); 
this.setInnerText(menuEntity.name); 
this.setAttributeIsNot("action", menuEntity.action); 
} 
}
Javascript 相关文章推荐
Mootools 1.2教程 排序类和方法简介
Sep 15 Javascript
html组件不可输入(只读)同时任何组件都有效
Apr 01 Javascript
易被忽视的js事件问题总结
May 14 Javascript
深入学习js瀑布流布局
Oct 14 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
Jan 18 Javascript
解决npm管理员身份install时出现权限的问题
Mar 16 Javascript
Angular使用过滤器uppercase/lowercase实现字母大小写转换功能示例
Mar 27 Javascript
在create-react-app中使用sass的方法示例
Oct 01 Javascript
vue-cli的build的文件夹下没有dev-server.js文件配置mock数据的方法
Apr 17 Javascript
node基于async/await对mysql进行封装
Jun 20 Javascript
Angular8 Http拦截器简单使用教程
Aug 20 Javascript
vue用elementui写form表单时,在label里添加空格操作
Aug 13 Javascript
js 效率组装字符串 StringBuffer
Dec 23 #Javascript
jquery 表单取值常用代码
Dec 22 #Javascript
JavaScript是否可实现多线程  深入理解JavaScript定时机制
Dec 22 #Javascript
JavaScript 图片预览效果 推荐
Dec 22 #Javascript
javascript 年月日联动实现核心代码
Dec 21 #Javascript
Javascript和Ajax中文乱码吐血版解决方案
Dec 21 #Javascript
利用jQuery的$.event.fix函数统一浏览器event事件处理
Dec 21 #Javascript
You might like
php计算一个文件大小的方法
2015/03/30 PHP
PHP如何将log信息写入服务器中的log文件
2015/07/29 PHP
jQuery UI-Draggable 参数集合
2010/01/10 Javascript
alert中断settimeout计时功能
2013/07/26 Javascript
jquery动态加载js三种方法实例
2013/08/03 Javascript
js处理php输出时间戳对不上号的解决方法
2014/06/20 Javascript
jQuery插件jRumble实现网页元素抖动
2015/06/05 Javascript
基于Jquery实现焦点图淡出淡入效果
2015/11/30 Javascript
jQuery+canvas实现的球体平抛及颜色动态变换效果
2016/01/28 Javascript
Node.js中Request模块处理HTTP协议请求的基本使用教程
2016/03/31 Javascript
javascript学习指南之回调问题
2016/04/23 Javascript
浅谈JavaScript的自动垃圾收集机制
2016/12/15 Javascript
JS使用cookie实现只出现一次的广告代码效果
2017/04/22 Javascript
jquery.param()实现数组或对象的序列化方法
2018/10/08 jQuery
cocos2dx+lua实现橡皮擦功能
2018/12/20 Javascript
详解js location.href和window.open的几种用法和区别
2019/12/02 Javascript
python迭代器的使用方法实例
2013/11/21 Python
Python Deque 模块使用详解
2014/07/04 Python
Python中使用PIPE操作Linux管道
2015/02/04 Python
使用Python读写文本文件及编写简单的文本编辑器
2016/03/11 Python
利用Python爬虫给孩子起个好名字
2017/02/14 Python
python读取二进制mnist实例详解
2017/05/31 Python
浅谈numpy中linspace的用法 (等差数列创建函数)
2017/06/07 Python
python实现发送邮件功能代码
2017/12/14 Python
Pandas GroupBy对象 索引与迭代方法
2018/11/16 Python
python+selenium实现自动抢票功能实例代码
2018/11/23 Python
Python redis操作实例分析【连接、管道、发布和订阅等】
2019/05/16 Python
Python 使用 environs 库定义环境变量的方法
2020/02/25 Python
Python3 xml.etree.ElementTree支持的XPath语法详解
2020/03/06 Python
利用python实现后端写网页(flask框架)
2021/02/28 Python
一家外企的面试题目(C/C++面试题,C语言面试题)
2014/03/24 面试题
Weblogic和WebSphere不同特点
2012/05/09 面试题
搞笑婚礼主持词
2014/03/13 职场文书
2015年国税春训心得体会
2015/03/09 职场文书
2015年会计工作总结范文
2015/05/26 职场文书
虎兄虎弟观后感
2015/06/12 职场文书