ajax day01 JS加强 -

h496950806

浏览: 68982 次
性别:

最近访客更多访客>>

u012363178

storyxsj

45571845

jadechenfei

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

ajax day01 JS加强

博客分类：

笔记

l JavaScript和Java一样存在两种数据类型

• 原始值（存储在栈Stack中简单数据）

• 引用值（存储在堆heap中对象）

l 5种原始数据类型

• Undefined、Null、Boolean、Number 和 String

• JavaScript中字符串是原始数据类型

l 通过typeof运算符，查看变量类型

l Instanceof查看变量是否属于对象实例

• 所有引用类型都是object

l 通过instanceof 运算符解决typeof对象类型判断问题

l 区分 undefined 和 null

• 变量定义了未初始化 --- undefined

• 访问的对象不存在 --- null

l String对象 ----- 字符串类型的引用类型

• var s = new String("itcast");==比较值

l Number对象 ---- 数字原始类型引用类型

• var n = new Number(100);

l Boolean对象 ---- 布尔原始类型引用类型

• var b = new Boolean(true);

l Math对象执行数学任务

l Date对象用于处理日期和时间

l Array对象数组对象，进行数组操作

l 方式一

function add(a,b){

return a + b;

}

函数无需定义返回值，可以直接返回

l 方式二

• var add = function(a,b){return a+b;}

l 方式三

• var add=new Function('a','b','return a+b;‘);

方法的最后一个参数是函数体，之前是可变参数

l 方式一

function add(a,b){

return a + b;

}

函数无需定义返回值，可以直接返回

l 方式二

• var add = function(a,b){return a+b;}

l 方式三

• var add=new Function('a','b','return a+b;‘);

方法的最后一个参数是函数体，之前是可变参数

编解码相关的内部函数：

l encodeURI / decodeURI 编解码URI

• 进行url跳转时可以整体使用encodeURI 对地址进行编码

l encodeURIComponent / decodeURIComponent 编解码URI组件

• 传递参数时需要使用encodeURIComponent

l escape / unescape 对字符串进行unicode编码

escape不编码字符有69个：*，+，-，.，/，@，_，0-9，a-z，A-Z

encodeURI不编码字符有82个：!，#，$，&，'，(，)，*，+，,，-，.，/，:，;，=，?，@，_，~，0-9，a-z，A-Z

encodeURIComponent不编码字符有71个：!， '，(，)，*，-，.，_，~，0-9，a-z，A-Z

其它内部函数：

l isNaN 检查某个值是否为数字

l parseInt / parseFloat 解析字符串为整数 / 浮点数

l eval 计算javascript 字符串，并把它作为脚本代码来执行

定义对象

javaScript中所有对象都是Object实例

var person = new Object();

JavaScript对象实际上是一个key:value 集合结构

person.name = “小丽”; // 定义属性

person.setName = function(name) { // 定义方法

this.name = name;

}

也可以使用 { } 来直接 JavaScript对象

var company = {

name : "中国银行",

getName : function(){

alert(this.name);

}

};

company.getName();

类定义

l function可以JavaScript函数，也可以定义JavaScript类结构

var Person = function(name,age){ // 构造函数

this.name = name;

this.age = age;

this.setName = function(name){

this.name = name;

};

this.getName = function(){

return this.name;

};

}

var p = new Person("小丽",18);

p.setName("小明");

alert(p.getName());

alert(p.age);

函数就是一个类:

function add(a,b){

return a+b;

}

var o=new add();

o.name='小李';

o.print=function(){

alert(o.name);

}

o.print()

修改类原型

l 通过function对象prototype属性添加类原型的属性和方法

var Car = function(){

}

var car1 = new Car();

// 通过function对象 prototype属性

// 去定义类模板原型中属性和方法

Car.prototype.name = "保时捷";

var car2 = new Car();

alert(car1.name);

car2.name = "宝马";

alert(car1.name);

var arr=new Array(25,3,18);

arr.sort();

Array.prototype.mysort=function(){

for(var i=0;i<this.length-1;i++)

{

for(var j=i+1;j<this.length;j++){

if(this[i]>this[j])

{

var temp=this[i];

this[i]=this[j];

this[j]=temp;

}

arr.mysort();

alert(arr);

Javascript单继承

function ClassA() {

}

ClassA.prototype.color = "blue";

ClassA.prototype.sayColor = function () {

alert(this.color);

};

function ClassB() {

}

//B和A有一样的效果

ClassB.prototype = new ClassA();

ClassB.prototype.sayColor=function(){

alert(‘red’);

}

var b=new ClassB();

JS多继承

function A(){

this.showinfo = function(){

alert("A的信息");

}

function B() {

this.printMsg = function(){

alert("B的信息");

}

function C(){

// 继承A

this.newMethod = A;

this.newMethod();

delete this.newMethod;

// 继承B

this.newMethod = B;

this.newMethod();

delete this.newMethod;

// 新加的方法

this.companyinfo = function(){

alert("c的信息");

}

var o=new C();

o.showinfo();

o.printMsg();

o.companyinfo();

BOM

l DOM Window 当前浏览器窗口

l DOM Navigator 浏览器类型

l DOM Screen 当前屏幕

l DOM History 浏览器历史记录

l DOM Location浏览器导航栏

1.Window

l Window 对象表示浏览器中打开的窗口

l 如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象

父操作子

window.frames 返回窗口中所有命名的框架

function jump(){

window.frames[0].location.href="http://www.baidu.com"

}

</script>

</head>

<body>

主页面

</body>

子操作父

Window.parent得到父对象

window.parent.document.getElementById("msg").value=company

l parent是父窗口（如果窗口是顶级窗口，那么parent==self==top）

l top是最顶级父窗口（有的窗口中套了好几层frameset或者iframe）

l self是当前窗口（等价window）

l opener是用open方法打开当前窗口的那个窗口

案例二：通过open和close 控制窗体打开和关闭 3.html

***** window对象 BOM模型中顶级对象，所有方法、属性调用省略 window.

Bom/3.html

案例三：opener使用，如果A窗口打开B窗口，在B窗口中 window.opener 获得 A窗口 window对象 4.html 5.html

使用 window. showModalDialog() 重写案例三 6.html 7.html

Js window.showModalDialog()方的使用简介

      a.url: 弹出窗口指向哪一个页面
      b.varArgIn: 向弹出页面传递的参数
      写法如下:
         window.showModalDialog("openner3.htm",tableObj);
2.在父页面中,如何制定所需传递的常数
      在Js中,定义一个类是很简单的(类的写法,不过感觉像是个HashMap),定义方法如下
      //定义一个超级对象
      var tableObj = new Object();
      //下面的写法就是自定义属性了,"tableObj."后面的属性名可以随便写,感觉有点像key值
      //"="后面的是属性值,也是什么都行,感觉有点像value值
      tableObj.table = window.document.getElementById("myTable");
      tableObj.userName = window.document.getElementById("txtUserName").value;
      //模拟调用一下
      var tempObj = tableObj;
      //在这里,"."后的属性名与之前对象定义的属性名一直就Ok了,感觉像通过key值取value值
      //"tempObj.table.tagName"之所以这样写是因为"tempObj.table"是指向了id为"myTable"的一个Table对象,所以可以调用这个对象的"tagName"属性来查看其是什么元素
      alert(tempObj.table.tagName);
      alert(tempObj.userName);
3.在子页面中如何接收来自父页面的参数
      调用下面的方法即可:
      var comeFromFatherPageObj = window.dialogArguments;
4.子页面向父页面传递返回值(当子页面即将关闭时)
      写法如下:
      //首先在父页面调用window.showModalDialog()方法的时候做些操作,如下:
      objReturnValue = window.showModalDialog("openner3.htm",tableObj);
      //然后再子页面,即将关闭的时候加一句话,如下:
      window.returnValue = "asdad";//可以是任何东西
      window.close();

三种常用函数

window.alert(String)

Boolean window.confirm(String)

String window.prompt(String)

l setTimeout(code,millisec)

• code 要调用的函数后要执行的 JavaScript 代码串

• millisec 在执行代码前需等待的毫秒数

eg:setTimeout(“showtime()”,1000)

广告漂浮

<head>

function move()

{

document.getElementById("layer1").style.left= Math.random()*500;

document.getElementById("layer1").style.top= Math.random()*500;

setTimeout("move()",1000);

}

</script>

</head>

</div>

<h2>随机漂浮的广告</h2>

</body>

其它浏览器对象：

l DOM History

• History 对象包含用户（在浏览器窗口中）访问过的 URL

• back() 加载 history 列表中的前一个 URL

• forward() 加载 history 列表中的下一个 URL

• go() 加载 history 列表中的某个具体页面

• 练习：返回按钮制作

DOM

nodeName	String	节点的名字；根据节点的类型而定义
nodeValue	String	节点的值；根据节点的类型而定义
nodeType	Number	节点的类型常量值之一
ownerDocument	Document	指向这个节点所属的文档
firstChild	Node	指向在childNodes列表中的第一个节点
lastChild	Node	指向在childNodes列表中的最后一个节点
childNodes	NodeList	所有子节点的列表
parentNode	Node	返回一个给定节点的父节点。
previousSibling	Node	指向前一个兄弟节点；如果这个节点就是第一个兄弟节点，那么该值为null
nextSibling	Node	指向后一个兄弟节点；如果这个节点就是最后一个兄弟节点，那么该值为null
hasChildNodes()	Boolean	当childNodes包含一个或多个节点时，返回真
attributes	NamedNodeMap	包含了代表一个元素的特性的Attr对象；仅用于Element节点
appendChild(node)	Node	将node添加到childNodes的末尾
removeChild(node)	Node	从childNodes中删除node
replaceChild (newnode, oldnode)	Node	将childNodes中的oldnode替换成newnode
insertBefore (newnode, refnode)	Node	在childNodes中的refnode之前插入newnode

l nodeName

• 如果节点是元素节点，nodeName返回这个元素的名称

• 如果是属性节点，nodeName返回这个属性的名称

• 如果是文本节点，nodeName返回一个内容为#text 的字符串

l nodeType

• Node.ELEMENT_NODE ---1 -- 元素节点

• Node.ATTRIBUTE_NODE ---2 -- 属性节点

• Node.TEXT_NODE ---3 -- 文本节点

l nodeValue

• 如果给定节点是一个属性节点，返回值是这个属性的值

• 如果给定节点是一个文本节点，返回值是这个文本节点内容

• 如果给定节点是一个元素节点，返回值是 null

Document常用对象方法

l 每个载入浏览器的 HTML 文档都会成为 Document 对象

l 常用属性

all[] 提供对文档中所有 HTML 元素的访问

forms[]返回对文档中所有 Form 对象引用

body 提供对 <body> 元素的直接访问

l 常用方法

• getElementById()返回对拥有指定 id 的第一个对象的引用

• getElementsByName()返回带有指定名称的对象集合

• getElementsByTagName()返回带有指定标签名的对象集合

• write()向文档写 HTML 表达式或 JavaScript 代码

分享到：

day19 javamail | ajaxday2 ajax json xstream

2014-05-02 10:37
浏览 653
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

ajax day01 JS加强

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

ajax day01 JS加强

评论

发表评论

相关推荐

git sshkey生成

hibernate04

hibernate03 一对一 多对多双向映射

hibernate_02 四种状态 多对一级联操作

hibernate_01hibernate入门简单api

struts2_03表单校验ognl国际化

struts02表单验证文件上传自定义拦截器类型转换常用常量

struts201 struts2环境搭建及入门

ajax03 jquery jquery_ajax

day25 注解技术 动态代理 servlet3.0 线程池

day20 文件上传与下载

day19 javamail

ajaxday2 ajax json xstream

day18 监听器 统计在线人数，定时销毁超时session，钝化活化session，在线列表显示和踢人功能防止用户自动登录，在线支付

day17过滤器 禁止缓存中文乱码自动登录MD5加密url级别权限控制

day16 项目1客户信息系统

day15 JDBC元数据 DBUtils 开发模型

day14 JDBC事务管理 数据库连接池技术

day13 JDBC 基础 事务控制 大数据 批处理

day12 mysql复杂sql语句编写

最近访客更多访客>>

hibernate03 一对一多对多双向映射

hibernate_02 四种状态多对一级联操作

day25 注解技术动态代理 servlet3.0 线程池

day18 监听器统计在线人数，定时销毁超时session，钝化活化session，在线列表显示和踢人功能防止用户自动登录，在线支付

day17过滤器禁止缓存中文乱码自动登录MD5加密url级别权限控制

day14 JDBC事务管理数据库连接池技术

day13 JDBC 基础事务控制大数据批处理