js-window对象的属性-DOM文档对象模型-操作元素对象

window对象的属性

1. location–地址栏属性
   href
   reload() 刷新

window.location.href="http://www.baidu.com";
window.location.reload();

2. screen屏幕属性

window.screen.width
window.screen.height

DOM文档对象模型

隶属于window对象 是window对象的一部分 主要用于动态操作HTML文档（检查 添加 修改 删除。。。）
window.document(window可以省略)

获取HTML元素对象

1. 直接方式
   1)通过iddocument.getElementById("name")
   2)通过namegetElementsByName("hobby")
   3)通过标签getElementsByTagName("input")
   4)通过classNamegetElementsByClassName("inp")
2. 间接方式
   1)父子方式
   先获取父元素（直接方式通过id）
   再通过父元素找子元素

				var div = document.getElementById("div");
				var cs = div.childNodes;

2)子父方式
先获取子元素（直接方式通过id）
再通过子元素找父元素

				var inp = document.getElementById("inp");
				var div = inp.parentNode;

3)兄弟方式 (横向的元素为兄弟元素)
先获取自身元素（直接方式通过id）
再通过自身获取兄元素 自身对象.previousSibling 前者
再通过自身获取弟元素 自身对象.nextSibling 后者

<input type="text" class="1"/><input type="text"id="inp" /><input type="text" class="2"/>

			function testBrother(){
				var inp = document.getElementById("inp");
				var pre = inp.previousSibling;
				console.log(pre.className);
				var nex = inp.nextSibling;
				console.log(nex.className)
			}

实现

1
2

操作元素对象

1. 获取元素对象

				var inp = document.getElementById("inp");
				alert(inp.type+":"+inp.name+":"+inp.value);

2. 操作元素对象的属性
   1）固有属性

				var inp = document.getElementById("inp");
				inp.type = "button"
				alert(inp.type+":"+inp.name+":"+inp.value);

2）自定义属性

				var inp = document.getElementById("inp");
				alert(inp.getAttribute("abc"));

				var inp = document.getElementById("inp");
				inp.setAttribute("abc","123");

3. 使用自定义属性的方法操作固有属性是允许的 但是获取的value属性中的数据 并不是实时的 而是默认的

				var inp = document.getElementById("inp");
				alert(inp.getAttribute("value"));
				
				var inp = document.getElementById("inp");
				inp.setAttribute("value","李四");

理解：这样修改不是实时的，更改后不会获得更新后的数据，上述setAttribute修改后，getAttribute获取的value永远是李四