HtmlDom学习_关于获取元素节点div下p节点内容underfind问题

现在有一段代码:

<div id="d1">
		<p>我是一号文本节点！</p>
		<P>我是二号文本节点！</P>
</div>

需要通过js来获取p里面的文本内容，但是是通过div来获取而不是直接给p节点加上id来获取，那么这很简单：

	<div id="d1">
			<p id="p1">我是一号文本节点！</p>
			<P>我是二号文本节点！</P>
		</div>
		<script>
			var x = document.getElementById("d1");
			document.write(x.firstChild.innerHTML);
		</script>

看起来好像没有什么问题，可是等我一运行：

运行结果是underfined…我在想是否子节点没获取到，于是我去重新看了下代码
firstchild没问题，我是想获取到当前div节点下的第一个子节点，但是获取失败的话就代表p并没有获取到，百度后发现有一种解决方法即去掉空白，DOM中，空白也是作为一个文本节点：

		<div id="d1"><p id="p1">我是一号文本节点！</p>
			<P>我是二号文本节点！</P>
		</div>
		<script>
			var x = document.getElementById("d1");
			document.write(x.firstChild.innerHTML);
			x.fir
		</script>

把p标签直接放到div标签后发现页面可以显示，但是这样代码看起来就非常的难看。
于是这里就有第二种方法，即直接获取元素节点：

document.write(x.firstElementChild.innerHTML);

当然，百度后发现还有别的方法，有人通过方法来去除空白节点，不过其实没太大必要，需要的人可以自行百度。