JavaScript的DOM_获取节点的类型

node 节点类型:节点可以分为元素节点、属性节点和文本节点,而这些节点又有三个非常有用的属性,分别为:nodeName、nodeType 和 nodeValue。

<script type="text/javascript">
     window.onload = function(){
        var box = document.getElementById(‘box‘);
        alert(box);                    //[object HTMLDivElement]元素节点对象
        alert(box.nodeName);        //获取元素节点的标签名,和tagName等价
        alert(box.nodeType);        //获取元素节点的类型值  1
        alert(box.nodeValue);        //获取节点的内容,但是元素节点本身没有内容,结果是null

        //node本身把节点指针放在元素<div></div>上,也就是说,本身是没有value的,如果要输出<div>XXX</div>中里面包含的内容那么使用innerHTML
        alert(box.innerHTML);        //获取元素节点里面的文本内容:测试Div<em>倾斜</em>结尾

     }
</script>
</head>
<body>
    <div id="box" class="pox" title="标题" style="color:#F00;" bbb="aaa">测试Div<em>倾斜</em>结尾</div>
</body>
</html>
时间: 2024-10-10 13:38:16

JavaScript的DOM_获取节点的类型的相关文章

JavaScript的DOM_获取元素方法_getElementsByTagName()获取相同元素的节点列表

不管是 getElementById 还是 getElementsByTagName,在传递参数的时候,并不是所有浏览器都必须区分大小写,为了防止不必要的错误和麻烦,我们必须坚持养成区分大小写的习惯. 一.通过标签名获取节点 1.getElementsByTagName()方法通过标签名获取节点,因为标签名会重复,所以返回一个对象数组 HTMLCollection(NodeList),这个数组保存着所有相同元素名的节点列表. <script type="text/javascript&qu

JavaScript的DOM_获取元素方法_getElementsByName()获取相同名称(name)的节点列表

一.通过标签的name属性获取节点 1.getElementsByName()方法通过标签的name属性获取节点,因为name有相同,所以返回一个对象数组HTMLCollection(NodeList). <script type="text/javascript"> window.onload = function () { if(document.getElementsByName){ var box = document.getElementsByName('text

JavaScript使用构造函数获取变量的类型名

在JavaScript中,如何准确获取变量的类型名是一个经常使用的问题. 但是常常不能获取到变量的精确名称,或者必须使用jQuery 中的方法,这里 我通过 typeof ,jQuery.type 和 通过构造函数来获取变量类型 这三种方法详细介绍一遍. 希望可以对你提供帮助. 看到题目的第一眼,有些同学可能会想到 typeof 运算符. 使用 typeof 获取基本的类型 在JavaScript语言中,给出了使用 typeof 运算符来获取基本的类型名.(注意不是基本类型) 这是 typeof

JavaScript的DOM_获取和操作层次节点

一.层次节点的概述 节点的层次结构可以划分为:父节点与子节点.兄弟节点这两种.当我们获取其中一个元素节点的时候,就可以使用层次节点属性来获取它相关层次的节点. 二.childNodes 属性 childeNodes 属性可以获取某一个元素节点的所有子节点,这些子节点包含元素子节点和文本子节点. <script type="text/javascript"> window.onload = function(){ var box = document.getElementBy

JavaScript的DOM_获取元素方法_getElementById()获取特定ID元素的节点

一.通过标签的id属性值获取该标签节点 接受一个参数:如果找到相应的元素则返回该元素的 HTMLDivElement 对象,如果不存在,则返回 null. <script type="text/javascript"> window.onload = function(){ var box = document.getElementById('box'); //获取 id 为 box 的元素节点 alert(box.id); } </script> </h

JavaScript的DOM_获取/设置/移除特定元素节点的属性_getAttribute()/setAttribute()/removeAttribute()

一.获取特定元素节点的属性的值_getAttribute() 1.getAttribute()方法将获取元素中某个属性的值.它和直接使用.属性获取属性值的方法有一定区别. <script type="text/javascript"> window.onload = function(){ var box = document.getElementById('box'); alert(box.bbb); // 获取元素的自定义属性值,非 IE 不支持 自定义的属性不可以,结

JavaScript的DOM_获取元素方法

W3C 提供了比较方便简单的定位节点的方法和属性,以便我们快速的对节点进行操作. 分别为:getElementById().getElementsByTagName().getElementsByName().getAttribute().setAttribute()和 removeAttribute(). 1.getElementById()方法: 接受一个参数:通过标签的id属性值获取该标签节点.如果找到相应的元素则返回该元素的 HTMLDivElement 对象,如果不存在,则返回 nul

JavaScript的DOM_获取元素周边大小

一.clientLeft 和 clientTop 这组属性可以获取元素设置了左边框和上边框的大小,目前只提供了 Left 和 Top 这组,并没有提供 Right 和 Bottom. <script type="text/javascript"> window.onload = function(){ var box = document.getElementById("box"); alert(box.clientLeft); alert(box.cl

JavaScript的DOM_获取CSS样式设置元素大小

一.通过 style 内联获取元素的大小 style 获取只能获取到行内 style 属性的 CSS 样式中的宽和高,如果有获取:如果没有则返回空. <script type="text/javascript"> window.onload = function(){ var box = document.getElementById('box'); //获取元素 alert(box.style.width); //200px. 没有设置的话为空 alert(box.sty