2013年11月_forwardNow

12月 11月 10月 09月 08月 07月 06月

原创 39-JavaScript-频道切换

1. 布局2. 实现中的难点 1) 垂直居中的实现前提: 容器不设 height 实现: 通过 padding-top 和 padding-bottom 压到中间去 2) 超链接组如何切换显示 display: none; display: block;3. 代码 body {

2013-11-27 22:26:04 834

原创 38-JavaScript-DOM-拖拽窗口-坦克的转向与移动

1. Style对象 1.1 参考 http://www.w3school.com.cn/htmldom/dom_obj_style.asp 1.2 说明 document.getElementById("id").style.property="值" 所有的HTML元素都有style属性 2. 拖拽窗口 1) 标

2013-11-27 17:42:39 1268

原创 37-JavaScript-DOM-小游戏-小球碰撞后折返

参考: Cascading Style Sheet 2.0 中文手册_.chm1. 背景图片 1) 语法 background-image : none | url (url) 2) 图片平铺,去重复 background-repeat : repeat | no-repeat | repeat-x | repeat-y 2. offse

2013-11-25 19:18:59 1364

原创 36-JavaScript-DOM-dom编程初解

1. Node 对象 Node 对象是整个 DOM 的主要数据类型。节点对象代表文档树中的一个单独的节点。节点可以是元素节点、属性节点、文本节点. 参考: http://www.w3school.com.cn/xmldom/dom_node.asp 参考DHTML: DHTML网页制作完全手册_.chm2. 常用属性

2013-11-25 14:10:42 944

原创 35-JavaScript-DOM-document对象

Document 对象1. 概述每个载入浏览器的 HTML 文档都会成为 Document 对象。即, Document对象代表整个HTML文档. Document 对象使我们可以从脚本中对HTML页面中的所有元素进行访问。提示： Document 对象是 Window 对象的一部分，可通过 w

2013-11-24 16:11:20 1036

原创 34-JavaScript-DOM-History-Location-Navigator-Screen-Event

1. History 对象 1) 说明 History 对象包含用户（在浏览器窗口中）访问过的 URL。 History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问. 由 JS Runtime Engine 自动创建. 2) 属性 length

2013-11-22 17:56:18 1230

原创 33-JavaScript-DOM-window对象常用方法2-属性

- window常用方法2 - - window属性1. 方法 1) window.moveTo(x,y) ① 功能可把窗口的左上角移动到一个指定的坐标。 ② 示例(注: 仅IE通过) function toNewPosition() { window.moveTo(300, 300

2013-11-21 22:24:54 1310

原创 32-JavaScript-DOM-BOM简介-node常用方法和属性-window对象常用方法

- BOM 介绍- dom 对象 - dom对象简介 - 常用dom对象层次图- dom对象详解 - window - event - document - body - style - image - link - form - all - 其他1. BOM Br

2013-11-20 23:16:12 1600

原创 31-JavaScript-DOM-介绍

- 为什么要学习dom编程- dom编程简介- 实例1. 为什么要学习dom编程实际上JS更重要的作用是让用户对网页元素进行交互操作. 是Ajax技术的基础2. 简介 1) DOM DOM, Document Object Model, 文档对象模型. 根据 w3c DOM规范, DOM是 HTML与XML的应用编

2013-11-20 20:43:26 1076

原创 30-JavaScript-事件-同一事件多个处理程序-window的事件-关闭右键菜单

1. 同一事件多个处理程序 111111111 var demo; function toRed() { alert("change to red!!") demo = document.getElementById("demo"); demo.style.backgroundColor = "red";

2013-11-18 16:05:02 947

原创 29-JavaScript-事件-事件驱动-更改外部css属性-区分浏览器内核

JS事件驱动编程JS事件1. 概述 JS是采用事件驱动(event-driven) 响应用户操作的. 1) 事件(Event) 如, 点击按钮按键等都称之为 ~. 2) 事件源 ① 网页元素(按钮, 输入框, 文本域, ...) ② 浏览器窗口 ③ 其他 3) 事件处理

2013-11-15 15:38:34 1143

原创 08-EasyUI_datagrid

0. 下载 1) JsonViewer json字符串格式化查看及校验工具 Json-Viewer.zip 2) 此示例的项目源码源码(MyEclipse2013项目) EasyUI_05-datagrid-src.zip1. 将div渲染成tabs 1) tabs The tabs d

2013-11-14 21:31:50 1292

原创 28-JavaScript-面向对象-系统函数-内部类-Math-Date-String-Array-Boolean-Number

内部类 - Math - Date - String - Array - Boolean - Number系统函数1. 内部类 1) 什么是内部类 JavaScript中本身就提供一些可以直接使用的类, 这种由JS本身事先定义好的类就是内部类 2) 主要的内部类 ① Array ②

2013-11-14 15:58:04 1519

原创 27-JavaScript-面向对象-闭包

闭包1. 什么是闭包(closure) JavaScript闭包就是在另一个作用域中保存了一份它从上一级函数或作用域取得的变量(键值对), 而这些键值对是不会随上一级函数的执行完毕而销毁的.2. 举例 function funcA() { var x = 0; function fun

2013-11-13 22:03:07 1058

原创 26-JavaScript-面向对象-三大特征-重载和覆盖

-JS面向对象编程 -- 三大特征 - 封装 - 继承 - 多态-重载和覆盖-综合案例1. 概念 1.1 抽象把一类事物共有的属性和行为抽取出来, 形成一个物理模型(模板). 这种研究问题的方法称为抽象. 1.2 封装 1) 介绍封装就是把抽象出来的属性和对属性的操作封装

2013-11-13 16:36:31 1396

原创 25-JavaScript-面向对象-构造器-更改this指向-遍历对象

- 构造器- 对象的创建- 更改this的指向- 遍历对象的属性和方法 for in1. 构造器定义类 1) 普通方式 function() { 属性; 方法; } 2) 构造器一 function(参数1, 参数2) { 属性1 = 参数1;

2013-11-13 14:08:39 1130

原创 24-JavaScript-面向对象-案例-移动mario图片

Super Mario //----------------------------------------------------- var marioImg; // 代表马里奥的图片 var step = 50; // 每次移动的增量 // 边界, 距离左上角的像素点 var topBound = 1; var leftBound =

2013-11-13 12:50:15 1115

原创 07-EasyUI_layout的引入

0. 截图与源码下载源码(MyEclipse2013拷贝): EasyUI_05.zip 1. 将body渲染成layout 注意: (1) 东南西北是可选, 中是必须的 (2) 推荐每个后台页面都使用layout,避免发生界面不能自适应的问题 2. 属性

2013-11-12 21:00:21 1633

原创 23-JavaScript-面向对象-Object类-扩展原型对象-成员函数

Object类扩展原型对象成员函数1. Object类 Object类是所有JavaScript类的基类, 它提供了一种创建自定义对象的简单方式, 而不需要再自定义构造函数. 1) 主要属性 ① constructor 对象的构造器 ② prototype 获得

2013-11-12 18:24:52 1496

原创 22-JavaScript-面向对象-构造函数-prototype

- 构造函数- 成员函数- prototype1. 成员函数的介绍小明 --> 人的实例属性: 身高体重 ... 行为: 吃饭睡觉唱歌 ... 成员函数就是用来描述对象的行为的2. 构造函数 -- 描述小明 function Person(name, height, weight

2013-11-12 13:10:52 787

原创 21-JavaScript-面向对象-对象的属性和方法以及this

- 对象的属性(私有/公有)- 对象的方法(私有/公有)- this0. 语法function ClassName() { var variableName1; // 私有属性 this.variableName2; // 公有属性 function func1() { // 私有方法 // do som

2013-11-12 10:56:17 853

原创 20-JavaScript-面向对象-类(原型对象) 和对象(实例)

- JS面向(基于)对象编程 - 类(原型对象) 与对象(实例) - 构造方法和 this - 成员变量和成员方法1. 概念 1.1 JS面向对象特征介绍 JavaScript是一种面向对象的动态脚本语言基于对象(Object-Based) 事件驱动(EventDriven) 具有

2013-11-12 00:25:30 1287

原创 19-JavaScript-基本语法-数组-冒泡-二分查找

数组- 一维数组- 排序查找- 多维素组1. 概念使用单独的变量名来存储一系列的值。数组的类型: 引用类型/复杂类型/复合类型.2. 注意 ① JS中的数组,可以存放任意数据类型 ② 函数调用时, 传参时传的是数组的引用 ③ 越界使用 var arr = [1, 2]; cons

2013-11-11 00:06:16 702

原创 18-JavaScript-基本语法-函数

函数1. 概念为完成某一个功能的程序指令(语句)的集合,称之为函数分类: 自定义函数,系统函数2. 语法 1) 定义 function methodName(var1,var2[,varn]) { // do something [ return 返回值; ] }

2013-11-10 18:11:08 741

原创 17-JavaScript-基本语法-流程控制

JS基本语法-三大流程控制1. 顺序控制2. 分支控制 2.1 if 让程序有选择的执行 ① 单分支 ② 双分支 ③ 多分支语法与 Java一致注: 只要有一个分支满足,则后续分支被忽略 2.2 switch 1) 语法 switch(表达式) {

2013-11-10 15:48:19 622

原创 MyEclipse相关设置记录

1. 格式化代码时行宽的设置 1.1 Java代码行宽 1.2 JSP代码行宽

2013-11-08 00:00:35 822

原创 16-JavaScript-基本语法-运算符-算术-关系-逻辑

基本语法-运算符1. 算术运算符 ① + 加 ② - 减 ③ * 乘 ④ / 除 ⑤ % 取模 ⑥ ++ 自增 -- 自减 ⑦ += -= /= *= %= // 弹出输入框,

2013-11-07 22:05:44 716

原创 15-JavaScript-基本语法-变量-规则-数据类型

基本语法1 变量 1) 声明使用 var 关键字, 甚至 var关键字可省 2) JS的变量类型究竟怎样决定 ① 弱数据类型在定义变量时, 统一使用关键字 var 表示即可, 甚至可以去掉var关键字弱, 即无需显示指定变量的类型. ② js中的变量的数据类型由js引

2013-11-07 20:15:11 785

原创 14-JavaScript-引入

- 引入- javascript介绍- 扩展: 花生壳- javascript开发工具介绍- 第一个javascript程序- javascript的基本语法(1)1. 引入 1)为什么要学习javascript javascript是实现网页动态效果的基石, 在web开发中扮演重要的就是,被广泛的应用到各个领域.

2013-11-06 23:11:41 976

原创打开chm乱码时解决方案

场景中文乱码的根源就是用错误的编码来解析文档造成的.解决方案我的默认浏览器是 360浏览器, 因为chm毕竟就那么几个选项,多试试,就莫名其妙的解决了乱码问题.设置一下再打开chm就OK,至于原理暂未搞清楚.

2013-11-06 19:29:04 1363

原创 13-DIV+CSS-仿搜狐布局(部分)

放搜狐主页布局1. 用背景色来标识div所占的空间,而不要用border 因为border有宽度2. div是块级元素,要在一行挨个排列,需要左浮动3. 最右边div的一般是向右浮动4. css中没有垂直定位, 可以用来实现登陆界面设为首页面超链接导航

2013-11-05 23:23:51 898 1

原创 12-DIV+CSS-定位

定位1. 基本概念 CSS定位(positioning)属性允许你对元素进行定位. 定位的基本思想很简单,它允许你定义元素框相对于其正常位置应该出现的位置相对于父元素相对于另一个元素相对于浏览器窗口本身的位置.2. position属性值 2.1 static(默认)

2013-11-04 22:28:19 780 1

原创 11-DIV+CSS-浮动

浮动1. 概念浮动的框可以向左或向右移动, 直到它的外边缘碰到包含框或另一个浮动框的边框为止由于浮动框不在文档的普通流中, 所以文档的普通流中的块框表现得就像浮动框不存在一样。左浮动右浮动清除浮动2. 左/右浮动 0) 初始情况, div纵向排列的

2013-11-03 23:19:13 989

原创 10-DIV+CSS-盒子模型实例

诸葛亮刘备赵云司马懿夏侯淳张飞甄姬张辽关羽华佗郭嘉大乔 /*去掉边距和填充*/ body {

2013-11-03 17:18:48 1367

原创 09-DIV+CSS-流和盒子模型初识

1. 流标准流/非标准流 ① 流在现实生活中就是流水, 在网页设计中就是指元素(标签)的排序方式 ② 标准流元素在网页中就像流水, 排在前面的元素(标签)内容先出现, 排在后面的元素(标签)内容后出现. ③ 非标准流当某个元素(标签)脱离了标准流的排列,则为~.

2013-11-03 15:43:58 807

原创 08-DIV+CSS-块元素和行内元素

块元素和行内元素1. 概念 - 行内元素(inline element), 又叫内联元素内联元素只能容纳文本或者其他内联元素, 即, 值栈内容宽度,默认不换行常见内联元素 - 块元素(block element) 块元素一般都从新行开,可以容纳文本内联元素块元素, 即, 块元素中内容即使不满一行,块元素也要占整行,要换行.

2013-11-03 13:33:01 1217 1

原创 07-DIV+CSS-选择器深入-通配符选择器-父子选择器-选择器分组

1. 通配符选择器 1) 概念选择所有元素 2) 语法 * { 属性名:属性值; ... ... } 3) 举例 * { margin: 0px; padding: 0px; } 让所有元素的外边距和内边距

2013-11-03 11:37:40 1691

原创 06-DIV+CSS-CSS的必要性和基本选择器

内容介绍- 初识 CSS- 块级元素和行级元素- CSS核心内容 - 标准流 - 盒子模型 - 浮动 - 定位- CSS综合案例 - 盒子模型经典案例 - 放sohu首页布局1. 使用CSS的必要性 1.1 语法注: ① 元素名: 为任意元素

2013-11-03 00:36:07 952

原创 05-DIV+CSS-引入

div+css 引入 - div+css简介 - 为什么需要div+cssdiv+css 的介绍 1 div+css 是什么 - div 元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素. - css 是Cascading Style Sheets(层叠样式表单)的缩写,它是一种用来表现HTML或XML等文件

2013-11-02 22:06:11 1186