2. 尚硅谷_佟刚_JavaScript DOM编程_获取元素节点.wmv原创

下面我们来看如何获取元素节点，实际上的话呢，我们要讲三部分内容，第一个如何获取元节点，第二个如何获取属性节点，第三个如何获取文本节点，因为节点一共就分为这三种类型吗？第一个看如何来获取元素节点，我们来写一段代码。直接。考入一个这个，嗯。考入一个HT文档，这部分的话呢，我们去掉，OK，大家看一下。打开。超级简单的一个页面，你喜欢哪个城市，你喜欢哪款单机游戏，然后底下的话呢，有两个这个选择，我们看一下。具体实现啊，是这样的，你喜欢哪个城市，这是个段落是吧？Ul啊，这是一个list，这是一个list，然后的话底下是一个两个radio，好了，我们现在要写的这个代码是什么呢？说我想来获取指定的节点。

说目标是获取指定的元素节点，怎么获取，比方说诶，我用来获取北京这个节点。就这个节点来第一个，那首先这个代码我们写到这个里边啊，Window加。等于方啊，我们的想法是第一稿啊，我想来获取，获取谁呢？获取ID为北京的这个点，获取点呢？点get，大家看get element，这不提供了这样的一个方法呀，OK，第一个get element by什么ID，那这个刚好啊，写个北京。

Four。北京等于是不是获取着了了北京保存心没问题，能够获取到。就是第一个办法叫根据ID获取指定的节点，那个ID是什么意思呢？就是在我每一个HTML这个节点作为一个ID属性，这个ID属性可以唯一的来定义这个节点，同样我当前ID节点是不能不能跟其他的这个ID当前节点的ID属性，这不是不能跟其他节点ID属性重复啊，你你得确保这个ID节点的属性值是。唯一的去确保A级属性值是唯一的一个吧。说在。

编写HTML文档时需确保，确保什么呢？ID属性值是唯一的，好，那于是的话呢，我根据ID获取挺爽的啊，再看第二个你想干什么呢？我想获取所有的Li截图。有几个呀？不八个呀，LY点特点是什么呀？这不是这个什么，这人就叫Li啊。于是大家看or Li nose等于点element by说有个t name t name，一个名叫。Li所有的好吧，那返回的是一个集合，这个集合有一个属性Li点。

嗯，长度应该是八效果刷新没有问题啊，正常情况下的话呢，就确保它是好用的是吧，我们在这个fire FOX里边，我们也需要来试一下。稍等啊，Fo不好用的话呢，我们用这个也可以，那可实现的也比较标准，反正都比IE强啊，IE是对差的。啊互动啊没问题啊，就是我们这个如何来获取呃，指定的Li节点，那这个实际上它是什么东西呢？它是使用什么呀，使用标签名来获取节点吧，看使用标签名获取指定节点的。

集合好了，那这两个呢是有区别的，第一个啊，说这个方法一定是document这个对象的方法。为document对象。的方法，而底下这个方法呢？该方法为什么呀，为。接口啊，方法什么意思啊？D任何一个节点都有这个，G任何一个节点都有这个方法什么意思啊。来看来看，我可以让C这个节点也来获取这个Li，这个时候C获取这个Li的话，就是C这个节点自个的Li，而不包含这几个Li，我们看一下来，首先were，一个city not等于document.get get什么D吧到。

好了，然后的话呢，我再过一个CK的Li no等于。不是第点。Get element by，大家看是不是有个bypa name吗？OK，这个时候我再写上一个，好，我们看看这个数量。CK。I know点儿。Les，看结果。刷新四看到了吧，这个时候的话呢，这个方法是获取指定节点的Li子节点的个数。

获取指定节点的Li点的个数，而调用大部分的呢，是获取整个文档Li的个数，区别哈，这个只能给到后面ID嘛，ID一定是滚动文档找，而获取指定节点的话，一我可以整个文档的，二我可以获取指定节点的指定子节点，这是第二个方式。好了，还有一个方式，比较常用的这种。三我们知道我们通常情况下的话呢，我们操作的是。啊，有表单的文档，所以说你看有表单跟其中有两个什么呀，有两个追究这个name。很重要啊，就是什么，就是这个表单元数的名，我也可以来根据。

表单元素的名来获取节点说三根据。根据呃加苗文啊，原数的name属性。名来获取指定的节点的集合，为什为什么是集合呀？因为对于单选和多选，它是不是有多个对应的节点。于是我们写一个或not等于document.get get element by name OK，都是by name的话呢，我们来写一个，看哈，真的，然后我们反应一下alert。S，这是不是有S啊？

Element集合，跟着nose点。应该是二。零。这对，有懂哦，爱need是吧，爱。保存。没问题。没问题，这个时候的话呢，我是可以。我是可以获取到的。OK，这是什么呢？这是根据。名字来获取，那根据名字获取的话有点小问题，什么小问题呢？大家往这看，往这看，大家看啊，我这个节点本身是不是有这个内幕属性啊，而我上边啊，我写的这个Li本身没有内幕属性，这是我硬加的一个，你这边发了一个这个警告嘛，是吧，你看我本身没定义过这个内幕属性，那我要是没有这个内幕属性的话，我能获取到吗？于是我们试试哈，我。

北京note two吧，等于。点get element by name好了，写成。行，好，我想看我能不能获取到。北京兔点。吧，OK好了，看这个结果，先去找这个实现的话呢，实际上是IE的直线。获取不着，但是我用C来获取一下呢。

不能获取的一，所以说IE跟跟火狐跟格的执行方式不一样，就IE和这个占有率目前还是第一嘛，是吧，还是有很多很多人在用这个IEIE特别恶心的就是以前IE6跟IE7的这个不一样特别大，我们要是在IE6下写跟在IE7下写觉IE8下写对吧，不一样，导致说有一次我们去这个买这个演唱会的门票是吧，它上面写了说呃，选座的这个功能只能在IE6上运行，IE7IE8不支持。所以说那个时候我们发现我们的这个IE都已经IE8了，然后想选座的话还得跑跑到网吧里边去，然后网吧里边也升级了，想选座的话怎么办呢？把系统卸了是吧，然后再重新安一遍。当然了，我们也可以创创一些其他带ID的程序也可以，反正就是它两个版本之间的兼容性也很差。

IE的话呢，用IE去为了照顾IE去写一个GS的个代码的话呢，确实是很郁闷，好在的话呢，现在这个IE带有率的话呢，可以减低了，第一其二的话呢，它支持的这个，呃，他他这个标准呢，比以前完善了，但是我们还是看到了这样的一个问题，怎么样。支持的支持的这个实现不一样，支持实现不一样的话，我们在写代码的时候就不能够用这样的实现，因为你这个实现是吧，你号称是好用的，就这IE里边不好使就不行好了，说弱说什么呢？弱元素是pml元素，自身没有定义name属性则。The get element by name elements by name方法对于ae无效，所以啊，所以该方法使用该方法转使用该方法时需谨慎。

没有别谨慎是吧，只要我本身有这个内幕属性的话，我就可以随便用，没这个属性的话就不行，那你说用这个方法的话呢，需要隐身，那实际上获取节点的方式最主要就是这三个方法，第一个根据ID获取，第二个根据标签名获取。第三个根据。原数的这个name属性获取，那这个的话呢，需要注意一下，只有有这个属性的话才能写，像我这样另加一个属性的话，IE不支持。所以说这个需要注意一下，还有一个方法。这有个这个。

IE根本就不支持，所以说我们就放弃了啊，不好用，IE根本就E，根本就不支持这个方法，那我们获取元数节点的三种方式，就是这样的三个方式，看一下笔记吧。看获取圆柱节点第一个at element I ID，根据ID属性来获取对应的特节点at element element根据什么呀？根据标签名获取。指定的节点的数组，那数组对象的类属性可以获取该数组的长度，还有一个根据内幕属性来获取，跟IE的实现方式，跟W3C有区别，有什么区别啊说。在天面文档里边，如果某个节点。Li没有内幕属性，而IE使用这个方法的话，就不能够获取到这个节点，但是火狐跟Chrome可以，所以说我们用的话呢，我们需要注意一下这个差别，还有两个方法，IE根本就不支持，所以说我们就不建议止痛。