JavaScript Dom + 内置对象一览表

长期学习补充中 ing~

一、window 对象

1.1 window 内置对象

功能 解释
window.location 获取当前页面的地址
window.alert(“xx”) 在游览器上弹出警告框
window.prompt() 在游览器上弹出输入框,同时也包含确认和取消的选项,点击确定给用户返回一个具体确定的值,点击取消会返回一个 null 值
window.confirm(“xxx”) 会在游览器弹出一个询问框窗口,拥有确定和取消的选项,并给用户一个 返回布尔值
window.close() 关闭窗口
window.open() 点开一个新的窗口 ( 不建议使用 )
window.setInterval( function() {} , 毫秒单位) 设置一个定时器
window.setTimeout(function() {} , 毫秒单位)) 延时器 (只会执行一次)
window.clearInterval() 清除定时器,同延时器

1.2 window 事件

功能 解释
window.onload() 页面加载时会执行
window.onlick() 执行页面点击事件
window.onchange() 事件状态改变时触发
window.onblur() 光标失去焦点事件

1.3 window 对象作为全局变量使用

window.x = xxx;

这样我们就定义了一个全局变量 x

注意
不建议这么使用 !!!

二、document 对象

2.1 dom 获取标签元素

功能 解释
getElementById(“xx”) 【id 是惟一的】 获取指定 id 的 html 页面元素对象
getElementsByTagName 获取一系列相同类型的标签(集合)
getElementsByClassName(“xxx”) 通过类名获取指定元素 或者元素集合

2.2 dom 标签操作

首先获得指定的标签,并赋值为 x

功能 解释
x.innerText 获取两个标签之间的 纯文本,也可以直接修改标签内部的所有内容
x.innerHTML 获取 两个标签的内容(包括标签),还可以在标签内部插入标签元素
x.value 获取 from 表单中文本框的内容

2.x 其他 dom 操作

功能 解释
document.title 获取页面标题
document.write 向游览器输出内容
document.URL 获取当前页面的 地址

三、JavaScript 内置对象

3.1 Object 对象

js 中一切皆对象

  1. 第一种使用方式,这种方法用的比较少,而且也不是很直观
var obj = new Object();
obj.name = "xxx";
obj.age = "1111";
  1. 第二种方式,使用大括号可以很直观的展示数据

这种格式也成为 json 格式

var person = {
	"name" : "xxx",
	"age" : "xxx",
	"hobby" : ["rap","唱歌","打篮球"]
}

3.2 常用的 Date 对象

var date = new Date();
方法 或 属性 功能
date.getFullYear() 获取当前的年份
date.getMonth() 获取当前的月份,但是月份是从0 开始的,最后一个月是 11,所以计算的时候要加一
date.getDate(); 获取当前的天数
date.getHours(); 获取当前的小时
date.getMinutes(); 获取当前的分钟
date.getSeconds(); 获取当前的秒数
date.getTime() 获取当前的时间戳,从 1970年1月1日至今的秒数
3.2.1 eg:获得当前的 年份,月份,天,时,分,秒,并实时刷新
		<div></div>
		<script type="text/javascript">
			function getTime() {
				var date = new Date();
				var year = date.getFullYear();
				var month = date.getMonth();
				var day = date.getDate();
				var hour = date.getHours();
				var minute = date.getMinutes();
				var second = date.getSeconds();
				var str = year + " " + (month + 1) + " " + day + " " + hour + " " + minute + " " + second;
				document.getElementsByTagName("div")[0].innerText = str;
			}
			setInterval("getTime()",1000);
		</script>

3.3 Array 对象

数组使用,通过对象创建

3.3.1 创建一个数组
var num = new Array(); // 创建一个空数组

var num1 = new Array(5); // 创建数组的长度为 5

var num2 = new Array(1,2,3); // 初始化数组

var num3 = [];  // 另一种创建数组的方式
3.3.2 数组中常见的用法
var arr = [];

arr.push(1); // 往数组的末尾插入一个元素

arr.unshift(2); // 往数组的头部插入一个元素

arr.pop(); // 往数组的末尾删除一个元素

arr.shift(); // 往数组的头部删除一个元素

arr.length; // 获取数组的长度
发布了128 篇原创文章 · 获赞 233 · 访问量 10万+

猜你喜欢

转载自blog.csdn.net/caidewei121/article/details/104358688