JavaScript基础（二）
JavaScript基础（二）
Html DOM
- DOM是文档对象模型（Document Object Model）
- javascript可以通过寻找标签的id找到对应的标签
- 对找到的标签可以做很多操作
- 包括修改，删除
- 也可对实践做出反应
找到标签
- id找标签
- x=document.getElementById(“demo”);
- name找标签
- x=document.getElementByName(“demo”);
- 类名找标签（找到所有段落的）
- x.getElementsByTagName(“p”);
写入内容
- 写入到输出流
- document.write();
- (注意，如果要输出字符串，必须要有引号，输出变量和数字不用)
- 改变元素内容
- x.innerHTML=”new text”;
- 改变元素属性
- x.src = “newimg.jpg”;
改变样式
- x.style.color = “blue”;
- x.style.visibiliyu = “hidden”;//设为隐藏和不可见
本篇省去了很多深入的知识，只是适用于对javascrip的大体框架做一了解，更多详细的知识请查看w3school
对行为作出反应
- 点击
- onclick=“”（引号里面可以加一个语句或者一个函数）
- 页面加载
- onload=“”//加载成功时执行
- onunload=“”//加载失败时执行
- 由于不同浏览器对于一些函数的支持不同，这两个反应可以区分不同浏览器
- 鼠标悬停
- onmouseover=“”//鼠标在此标签上方悬停时执行
- onmouseout=“”//鼠标离开后执行
- 如果onmouseout的结果和一开始不同，离开后不会回到一开始的状态
- 改变
- onchange=“”//值改变后执行
- 按住和离开
- onmousedown=“”//鼠标按下不放
- onmouseup=“”//鼠标松开后
- 和鼠标悬停一样，如果松开后的效果和一开始不同，松开后不会回到一开始的状态
- 发现一个小bug，按下后把鼠标一直按下脱离标签区域再松开，发现标签会一直保持按下状态
- 聚焦
- onfocus=“”//一般只对input标签使用，点击输入框之后执行
增加新节点（标签）
- 创建新标签
- var para=document.createElement(“p”);
- 创建标签文本内容
- var node=document.createTextNode(“这是新段落。”);
- 为这个标签添加文本内容
- para.appendChild(node);
- 找到一个节点并加入
- var element=document.getElementById(“div1”);
- element.appendChild(para);
删除节点（标签）
- 找到要删除的节点
- var child=document.getElementById(“p1”);
- 找到要删除节点的父节点
- var parent=document.getElementById(“div1”);
- 删除掉这个节点
- parent.removeChild(child);
- 也有快捷办法
- document.getElementById(“p1”).parentNode.removeChild(child);
JavaScript对象
- 和所有面向对象的语言一样，javascriot也有对象
- 对象有其属性与方法，方法就是
创建对象
- 构造函数（这个构造函数和java不同）
- 这里没有类的概念，原来java的类的位置就是现在构造函数的位置，类变量就可以看成是这里对象数属性
- 如下面的程序，上半部分是构造函数，下面是这个对象的一个方法
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
}for in 循环遍历对象属性
var person={fname:"Bill",lname:"Gates",age:56};
for (x in person)
{
txt=txt + person[x];
}数字
- 所有数字都是64位的
- 浮点数计算不精确，如果要计算最好先化为整数，再做除法
- 整数最多15位
- 八进制前面加0，十六进制前面加0x
字符串
- .length //求字符串长度
- .big //变大
- .small//变小
- .bold//加粗
- .itallics//斜体
- .fixed//变细
- .strike//划掉
- .fontcolor//字体颜色
- .fontsize//字体大小
- .toLowercase//全小写
- .toUppercase//全大写
- .sub//下标
- .sup//上标
- .link//链接
- .indexof//首次出现的位置，不在为-1
- .match//匹配，返回匹配的或null
- .replace(/bereplaced/,”replace”)//替换
日期
- Date() //获取时间
- getTime()//获取时间戳
- getDay()….hours，seconds….很多很多就不列举了
数组
略
布尔型
- “false”是true
- “”是false
算数Math
- .round()//四舍五入
- .random()//0-1的随机数
- .max，min
正则表达式
- 比如在验证邮箱的时候使用，验证是否是规定格式的
