初探JS节点 node
在使用原生JS获取元素节点的时候发现没有获取成功，想起来应该是获取到了nodeType = 3的文本节点，再次专门记录一下解决过程。
参考caocx的博客:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
//关于节点的属性：nodeType,nodeName.nodeValue
//在文档中，任何一个节点都有这三个属性
//而id,name,value是具体节点的属性
window.onload = function () {
//1,元素节点的这三个属性
var bjNode = document.getElementById("bj");
alert(bjNode.nodeType);//元素节点：1
alert(bjNode.nodeName);//节点名：li
alert(bjNode.nodeValue);//元素节点没有nodeValue属性值：null
//2,属性节点
var nameAtr = document.getElementById("name").getAttributeNode("name");
alert(nameAtr.nodeType);//属性节点：2
alert(nameAtr.nodeName);//属性节点的节点名：属性名name
alert(nameAtr.nodeValue);//属性节点的nodeValue属性：属性值username
//3,文本节点
var textNode = bjNode.firstChild;
alert(textNode.nodeType);//文本节点：3
alert(textNode.nodeName);//节点名：#text
alert(textNode.nodeValue);//文本节点的nodeValue属性值：文本值本身：北京
//nodeType、nodeName是只读的
//而nodeValue是可以被改变的
//以上三个属性，只有在文本节点中使用nodeValue读写文本时使用最多
}
</script>
</head>
<body>
<p>你喜欢那个城市</p>
<ul id="city">
<li id="bj" name="BeiJing">北京</li>
<li>上海</li>
<li>香格里拉</li>
<li>天山</li>
</ul>
<br><br>
<p>你喜欢那个游戏</p>
<ul id="game">
<li id="rl">贪吃蛇</li>
<li>搬箱子</li>
<li>魔兽</li>
<li>lol</li>
</ul>
<br><br>
name:<input type="text" name="username" id="name" value="你是个傻瓜"/>
</body>
</html>
<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<p>123</p>
<div id="test"></div>
<script>
window.onload = function () {
var oElem = document.getElementById('test');
do {
oElem = oElem.previousSibling;
} while (oElem && oElem.nodeType != 1);
console.log(oElem); //=> <p>123</p>
}
</script>
</body>
</html>
将获取上一个兄弟元素节点的方法封装成函数：
function prev(elem) {
do {
elem = elem.previousSibling;
} while (elem && elem.nodeType != 1);
return elem;
}
