javascript快速笔记（上）

这是我自己学习java web时快速入门的笔记。

javascript的document

对象类型：document

• 属性：如title
• 事件：什么时候发生，如页面和页面上的元素完成加载时
• 方法：用来做什么，如使用元素ID访问一个元素

javascript的内置对象

• 浏览器对象模型:

//产生一个浏览器对话框
window.print();
//设备像素宽度
window.screen.width;
// 实现页面跳转。
window.location.href = "log.html";

• 文档对象模型(DOM)

//通过id获取元素
document.getElementById('one');
//当前页的上次修改日期
document.lastModified;

• 全局javascript对象

var hotel = "abC";
hotel.toUpperCase();
//返回PI
Math.PI();

javascript 事件

事件举例：

• 鼠标点击
• 页面或图像载入
• 鼠标悬浮于页面的某个热点之上
• 在表单中选取输入框
• 确认表单
• 键盘按键

注意：事件通常与函数配合使用，当事件发生时函数才会执行。

javascript 事件处理步骤

1. 选中需要使用脚步进行事件响应的元素节点
2. 声明需要在选中节点上响应触发的事件
3. 指定当事件发生时需要运行的代码

示例1：

function checkUsername(){
  //TODO:
}

var el = document.getElementById("username");
el.addEventListener('blur',checkUsername,false);

示例2：

//TODO 需要自己实现recorderControls函数和writeLabel函数
//可以判断浏览器是否支持addEventListener
if(document.addEventListener) {
  //click鼠标点击事件,匿名函数用于传入参数
  document.addEventListener('click', function(e) { recorderControls(e); }, false);
  //（输入框）表单输入事件
  noteInput.addEventListener('input', writeLabel , false);
}
else {
  noteInput.attachEvent('onkeyup', writeLabel);
}

更详细的代码可以参考我的github:
https://github.com/Iamttp/JSTest
下一节，我将记录在web方面经常遇到的JQuery使用笔记。