Array
数组
定义
var 变量名 = new Array(元素列表);//方式一
var 变量名 = [ 元素列表 ];//方式二
访问
arr[ 索引] = 值;
属性
length : 设置或返回数组中元素的数量
方法
forEach() : 遍历数组中每个有值的元素,并调用一次传入的函数(for循环遍历所有元素)
push() : 将新元素添加到数组的末尾,并返回新的长度
splice() : 从数组中删除元素
arr.forEach(function (e){
console.log(e);
})
//简写----箭头函数
arr.forEach((e) = > {
console.log(e);
})
String
字符串
定义
var 变量名 = new String ("...");//方式一
var 变量名 = "...";//方式二
属性
length : 字符串的长度
方法
charAt() : 返回在指定位置的字符
indexOf() : 搜索字符串
trim() : 去除字符串两边的空格
substring(start,end) : 提取字符串中两个指定的索引号之间的字符(含头不含尾)
自定义对象
定义
调用
JSON
定义
与自定义对象的区别是key有双引号引起来。
var 变量名 = '{ "key1" : value1, "key2" : value2}';
value的数据类型:
- 数字(整数或浮点数)
- 字符串(在双引号中)
- 逻辑值(true或false)
- 数组(在方括号中)
- 对象(在花括号中)
- null
JSON字符串转为JS对象
var jsObject = JSON.parse( userStr );
JS对象转为JSON字符串
var jsonStr = JSON.stringify( jsObject );
BOM
浏览器对象模型 (BOM),使 JavaScript 有能力与浏览器"对话"。JavaScript将浏览器的各个组成部分封装为对象。
组成:
- Window : 浏览器窗口对象
- Navigator : 浏览器对象
- Screen : 屏幕对象
- History : 历史记录对象
- Location : 地址栏对象
Window
获取:
直接使用window,其中window.可以省略
属性:
history : 对History对象的只读引用
location : 用于窗口或框架的Location对象
navigator : 对Navigator对象的只读引用
方法:
alert() : 显示带有一段消息和一个确认按钮的警告框
confirm() : 显示带有一段消息以及确认按钮和取消按钮的对话框(确认返回true,取消返回false)
setInterval() : 按照指定的周期(毫秒计)来调用函数或计算表达式
setTimeout() : 在指定的毫秒数后调用函数或计算表达式
//定时器--setInterval(周期性的执行某一个函数)
var i = 0;
setInterval (function(){
i++;
console.log("定时器执行了" + i + "次");
},2000);
//定时器--setTimeout(延迟指定时间执行一次)
setTimeout(function(){
alert("dddd0");
},3000)
其他方法:
- window.open() - 打开新窗口
- window.close() - 关闭当前窗口
- window.moveTo() - 移动当前窗口
- window.resizeTo() - 调整当前窗口的尺寸
Location
获取:
window.location获取,window.可以省略
属性:
href : 设置或返回完整的URL
DOM
文档对象模型
当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。
将标记语言的各个组成部分封装成对应的对象:
- Document : 整个文档对象
- Element : 元素对象
- Attribute : 属性对象
- Text : 文本对象
- Comment : 注释对象
通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML。
- JavaScript 能够改变页面中的所有 HTML 元素
- JavaScript 能够改变页面中的所有 HTML 属性
- JavaScript 能够改变页面中的所有 CSS 样式
- JavaScript 能够对页面中的所有事件做出反应
HTML中的Element对象可以通过Document对象获取,而Document对象是通过window对象获取到
Document对象中提供了以下获取Element元素对象的函数:
1. 根据id属性值获取,返回单个Element对象
var h1 = document.getElementById('h1');
2.根据标签名称获取,返回Element对象数组
var divs = document.getElementsByTagName('div');
3.根据name属性值获取,返回Element对象数组
var hobbys = document.getElementsByName('hobby');
4. 根据class属性值获取,返回Element对象数组
var clss = document.getElementsByClassName('cls');
设置或返回元素的内容
element.InnerHTML();
更多:
HTML DOM Document 对象 (w3school.com.cn)