Java基础——JavaScript概述、DOM

JavaScript概述

javaScript（JS）是基于对象和事件驱动的脚步语言，主要应用在客户端

特点：

1、交互性。它可以做的就是信息的动态交互

2、安全性。不允许直接访问本地硬盘

3、跨平台性。只要可以解释JS的浏览器都可执行，和平台无关

JS与java的不同

1、JS是Netscape公司的产品，JAVA是Oracle公司产品

2、JS是基于对象，java是面向对象

3、JS是弱类型语言，java是强类型

关于编程语言学习的一些共性总结

一般编程语言都包含以下几部分，学习编程语言时，要对于以下几部分做着重了解

1、变量。数据不确定，用变量存储

2、注释。单行、多行注释

3、标识符。起名字

4、关键字。被赋予了特殊含义的单词

5、语句。控制程序的运行流程

6、函数。用于封装代码提高复用

7、数组。数据多了，需要存储再使用。索引

JS变量

var x=3；

var x=”abc”;

var x=2.3;

var x=ture;

小结：在JS 语言中，不管何种类型的数据，定义变量式，都用数据类型var表示。

for(var z=0;z<3;z++){
alert("z="+z);
}
//在这段代码中，var=0是一个全局变量，这时JS与java的另一个不同之处

小结：在JS中创建的变量及时定义在语句中也是全局变量；定义在函数中的变量才是局部变量

JS运算符

alert（5320/1000）；//结果为5.32；注意在Java语言中，默认 数据类型为int，因此该结果为5

alert（‘13’+ 8）；//138；”+“为连接符

alert（’13’ - 8）；//5;自动将字符串”‘13转成了数值

但是开发中应避免这种写法

正确的写法：alert（（parseInt）’13’ - 8）;//5

&&与||是逻辑运算符， &、|是位运算符

特殊运算符：

typeof：返回一个操作表达式的数据类型的字符串
alert（typeof（“abc”））；//String
alert（typeof（“1.2”））；//number
alert（typeof（“true”））；//boolean
alert（typeof（“45”））；//number

JS 语句中

在JS中，非0非null即为true，默认为1，否则都是false ，默认为0

document.write(); // JS中的输出语句

函数：

格式：function 函数名 （参数列表）{

函数体；

return 返回值；

}

JS中的函数内部内置了一个参数数组，用于存储接收到的实际参数，数组名为arguments

JS的函数在内存中其实是一个对象

函数名就是指向这个对象的引用

var  z=method();//运行method方法，将运算完的结果返回并赋值给z
var  z=method;  //将method引用存储的对象的地址赋值给z,那么z也执行了这个函数的对象

alert（"z="+z）;//直接弹出z,z指向的对象转成字符，其实就是调用tostring方法，函数对象的字符串表现形式就是函数的定义形式

动态函数

使用JS中已有的内置对象。function

var getsum=new  function("x","y","var sum=x+y;return sum;");//动态函数的表现形式

动态函数与一般函数的区别：

动态函数的参数列表和函数整体都是可以通过参数指定的

数组

var arr=[];//定义了一个长度为0 的数组

特点：

1、JS中的数组是一个容器

2、长度可变

3、可以存储任何类型的数据，因为JS是弱类型语言

表示方式：

var  arr=new  Array(3);//创建了一个长度为3的数组
var  arr=new  Array(3,1);//创建了一个长度为2的数组，元素为3、1

内置对象

Array 、string、Math 、 Date 、Boolean等

Prototype 属性

用prototype属性提供对象的类的一组基本功能，对象的新实例“继承”赋予该对象原型的操作

原型的使用：给已有的JS中的类属性和行为

JS中的两个特有的语句

1、for in

for(变量 in 对象){}//遍历对象中的内容

2、with

简化书写，如果对象名称过长，可用with语句简化书写

例如：

p.age=30;
p.name="小强";
p.setname;
//这段代码可简写为
with(p){
age=30;
name="小强";
setname；
}

DOM

DOM：Document Object Model 文档对象模型

作用：将标记性文档以及文档中的标签等所有内容都封装成了对象

DOM解析技术的特点：

DOM技术本身内置在浏览器中，直接对标记性文档解析成对象驻留在内存中，并按照标签的层次关系生成一个DOM树，树中所有的内容都称之为节点，也就是对象



标签是节点中一张最常见的被使用的内容

正因为DOM的解析将文档和内容变成了对象，才有了动态操作的可能

DHTML：多项技术综合体的简称

HTML：提供标签，用于封装数据，给数据加标记，他是最基础的部分

CSS：提供样式，用于对标签中的数据进行丰富的效果展现

DOM：提供解析，将标记型文档以及文档中的内容都封装成了对象，在对象中定义了更多的属性和行为

javaScript：提供逻辑性较强的程序设计内容，可以对对象的操作进行控制，负责的是页面的动态的行为

BOM：浏览器对象模型

将浏览器以及浏览器中的一些内容封装成了对像

window：代表浏览器窗体对象

通过window对象获取document对象

获取document对象的原因：因为标签都在文档中，所以想要获取标签需要先有document对象

小结：只要是标记型的，先拿document对象

获取标签的方法：

通过DHTML手册查阅document兑现的方法

getElementByID:通过ID属性获取标签，返回该标签节点对象，想要操作页面标签中的数据，必须先获取到该标签对象

页面中所有的节点都有三个属性

节点名称、节点类型、节点值

注意：不是所有节点都具备节点值，但都具备名称和类型
4000

getElement*s*Byname//凡是写着”S“的返回值都是数组，

需求：对新闻字体进行改变，给用户提供大中小三种字体的选择

思路:

1、HTML通过标签定义页面基本结构

2、CSS 定义页面的样式

3、确定事件源和事件

事件源：超链接

事件：点击事件 ，onclick

注意：超链接本身带有默认的事件，现在改超链接不需要默认的事件处理，怎么取消呢？

href=”javascript:void(0)”

没有了默认效果，需要在该事件源注册指定事件，并明确处理方式

4、定义处理方式的具体内容

在处理方式中，必须要明确被处理的节点，获取该节点对象并调用其属性和行为，完成处理

——————————————————————————————-

学习总结：对于javaScript，HTML，CSS等技术的学习，主要是其中方法的使用，需要多联系，在记忆大量方法的情况下，对于辅助学习的手册的使用至关重要，借组手册进行联系，是学好这些技术的关键