生活明朗，万物可爱？
1、 document.getElementById(id)用法
1、 document.getElementById(id);
[作用] 通过当前元素节点的id，获取对应的元素节点
2、元素节点属性
通过这个节点对象，访问它的一系列属性。
tagName 获取元素节点的标签名
innerHTML 获取元素节点标签中的内容，解析标签
3、HTML中的属性和方法
id
title
style
className 对应的是class
访问这些节点的方法
元素节点.属性名
或者
元素节点（属性名）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>dom_byid元素</title>
<script type="text/javascript">
/*
document.getElementById(id);
[作用] 通过当前元素节点的id，获取对应的元素节点。
元素节点属性
通过这个节点对象，访问它的一系列属性。
tagName 获取元素节点的标签名
innerHTML 获取元素节点标签中的内容，解析标签
HTML属性的属性
id
title
style
className 对应的是class
访问这些节点
元素节点.属性名
或者
元素节点（属性名）
*/
/* var oDiv1=document.getElementById("Div1");
alert(oDiv1);//运行结果为null，原因为代码自上而下运行，因此我们运行这部分的内容并没有加载
解决办法：直接将整个script标签放入body中(语法规范，一般放入head中)
或者用window.onload
*/
window.onload=function(){/* 在页面加载完成以后的函数 */
var oDiv1=document.getElementById("Div1");
// alert(oDiv1.tagName); 获取标签名
// alert(oDiv1.innerHTML);/* 获取标签中的内容 */
// oDiv1.innerHTML="<h1>测试</h1>";/* innerHTML赋值时如果含有标签会直接解析 */
// alert(oDiv1.id);
// alert(oDiv1.title);
// alert(oDiv1.className); 这三个为取值操作
/* oDiv1.title="tt";
oDiv1.className="obt"; */
// alert(oDiv1.style);//(object MStyeCSSPropries css样式
// alert(oDiv1.style.width);
/* oDiv1.style.width="400px"; */
/*
在style样式中，background-color属性需要去掉-，然后再将单个单词color的首字母大写
*/
// alert(oDiv1.style.backgroundColor);输出red;
oDiv1.style.backgroundColor="yellow";
}
</script>
</head>
<body>
<div id="Div1" title="helloworld" class="box" style="width: 300px;height: 300px; background-color: red;"><en>测试div</en></div>
</body>
</html>