标签：onkeyup   显示   html网页   use   api   文本处理   控制台   return   表达式   

javascript 浏览器脚本语言
1) 基本数据类型：数字，字符串， 布尔值， null， undefined
2) 复杂数据类型：
数组
var array = new Array();
var array = [1,2,3,4];
访问元素 array[下标]
for(var i = 0; i array[i]
}
.push(值); .pop();
.unshift(值); .shift();
.splice(下标, 个数);
.sort(); // 对数组进行排序，但会把元素视为字符串类型
.sort( (a,b)=>{ a - b } );

对象
var obj = new Object();
var obj = {name:"值", age:17};
obj.sex = "男";
delete obj.sex;

函数
function 函数名(形参名1, 形参名2, ... 形参名n) {
return
}

函数名(实参1, ... 实参 n)

js中函数没有重载特性，同名函数只能有一个，后定义的会覆盖前面定义的

日期
var date = new Date();
var date = new Date(毫秒值);
.getFullYear();
.getMonth();
..

正则表达式
var reg = /正则表达式/;

[0-9] [a-zA-Z]
? , +, *, {m,n}

reg.test("目标字符串"); // true, false

字符串对象.replace(reg , "替换内容");

3) html网页中使用js

F12 控制台窗口

1.js配合html实现网页编程

DOM API (用js来操作html的一套api)
document 文档 Object 对象 Model 模型
可以把整个html视为一个树状结构，html中的每个标签都是树上的一个节点
document
|- html
|-head
|-meta
|-title
|-style
|-script
|-body
|-p
|-form
|-table
|-ul

1.1 查找元素

document.getElementById(标签id值); // 在设计id时要避免重复，id的取值应当唯一
document.getElementsByTagName(标签名字); // 根据标签的名字查找多个元素
父元素.getElementsByTagName(标签名字); // 查找从属于此父元素的所有与标签名称符合的子标签, 缩小了查找范围

通过选择器语法进行查找
#id， .class值, 元素

document.querySelector("选择器"); // 查找与选择器匹配的标签， 匹配第一个
document.querySelectorAll("选择器"); // 查找与选择器匹配的标签, 匹配所有

1.2 修改

修改内容
.innerText 在赋值时，把字符串当做普通文本处理，如果字符串中包含了html标签，那么这些标签会照原样输出
.innerHTML 在赋值时，把字符串当做html代码处理，会解析html标签再显示
修改属性
.属性名 = "新值";
修改样式
.className="新class" // 对应访问class属性 (推荐使用class属性修改样式)
.style.具体样式名="新值"; // 注意style 优先级较高，会覆盖其它样式

1.3 删除

父元素.removeChild(子元素);

1.4 新增

父元素.appendChild(子元素); // 建立父子元素关系
document.createElement("标签"); // 创建新的标签元素

2. DOM事件

2. 事件类型

鼠标单击事件 onclick
鼠标双击事件 ondblclick
鼠标移入事件 onmouseover
鼠标移出事件 onmouseout
光标移入事件(获得焦点) onfocus
失去焦点事件 onblur
值改变事件 onchange
键盘 onkeydown 按下按键时
onkeypress 按下按键时
onkeyup 松开按键时

javascript

标签：onkeyup   显示   html网页   use   api   文本处理   控制台   return   表达式   

原文地址：http://blog.51cto.com/13852519/2175462