原生JS与jQuery获取节点的方法

JavaScript010

原生JS与jQuery获取节点的方法,第1张

  首先我们来介绍一下DOM中元素与节点间的关系:页面中所有内容都是节点[包括元素,属性,文本],所以节点是包括元素的。

  以下是节点的三个属性:

  若是火狐和chrome浏览器上述方法不存在兼容问题,而若是在IE8浏览器中后四组内容只能获取元素,无法获取文本或属性。即原获取节点方法-->取元素;原获取元素方法-->undefined。

  jQuery中是以方法的形式进行调用,同时都是用来获取元素:

对于文本节点,节点值为文本内容;对于属性节点,节点值为属性的值。

节点值对于文档节点和元素节点是不可用的。

获取节点值的语法:

    nodeObject.nodeValue

其中,nodeObject 为DOM节点(节点对象)。

举例,获取文本节点的节点值:

<div id="demo3">点击这里显示文本节点的值</div>

<script type="text/javascript">

    document.getElementById("demo3").onclick=function(){

        alert(this.firstChild.nodeValue)   //  this 指当前发生事件的HTML元素,这里是<div>标签

    }

</script>