js获取节点

转载 2011年01月18日 10:36:00

●DOM:文档对象模型,代表整个HTML页面

▼获取窗口大小:
  document.documentElement.clientWidth/clientHeight    ○获取当前窗口宽/高,IE与DOM均可使用
  document.body.clientWidth/clientHeight               ○body对象宽/高
  document.body.offsetWidth/Height                     ○视口(不是窗口,显示HTML页的区域)大小

▼获取节点:  IE某些节点只能通过name属性值获取,所以最好id与name都写出来,且值一样
             注:  节点调用get方法,便相对定位于该节点,只在该节点上下查找相关节点

  document.getElementByIdx("节点id");           ○根据节点id获取节点,返回节点对象
  document.getElementsByTagName_r("标签名");     ○根据标签名,获取该标签表示的节点对象数组
  doucment.getElementsByName("name属性值");    ○根据name属性值,获取该值表示节点的对象数组.如radio单选框
                                                 附:  radio的checked属性,选中返回true,否则false

▼节点属性:    var node=document.getElementByIdx("??");

  node.nodeName     ○节点标签名    如:HTML/BODY/DIV/#text(文本节点名)
  node.nodeType     ○节点类型      1(元素结点) 3(文本结点)
  node.nodue    ○节点文本内容  文本结点返回文本内容(文本内容是文本结点一个属性),元素结点返回null
  node.属性名       ○获取节点指定属性值
  node.属性名="?";  ○给节点指定属性重新赋值
  node.getAttribute("属性名")/setAttribute("属性名","属性值")    ○获取/重置属性值,但某些浏览器不支持,建议不用

  node.parentNode              ○获取父节点
  node.childNodes              ○获取子节点,返回子节点数组
  node.childNodes[i]           ○直接获取该节点下第i个子节点
  node.firstChile/lastChild    ○获取该节点下第1个/最后1个子节点
  node.previousSibling/nextSibling    ○获取同属一父节点下,该节点的上/下一节点

▼节点方法:  var ul=document.getElementByIdx("ul.id");    ○以一个ul无序列表为例

  var li=document.createElement("标签名(如li)");       ○创建一个指定标签类型的节点
  var te=documnet.createTextNode("文本内容");          ○创建一个文本节点

  ul.appendChild(li);    ○在ul中追加一个li子节点
  ul.insertBefore(li,ul.firstChild);    ○在第2个参数指定节点前插入第1个参数表示的节点

  var _li=li.clone();    ○克隆一个新节点.浅层克隆,不能克隆节点下面子节点,clone(true)则完全克隆

  ul.removeChild(子节点);    ○删除该节点下子节点,如果没有该子节点,则会报错
  ul.hasChildNodes();        ○判断该节点下是否存在子节点.存在返回ture,否则false

▼innerHTML:  MS提出的,所有浏览器支持,但IE的table,select不支持

  node.innerHTML="html代码";     ○向指定节点开闭标签内填入html代码,然后被执行
  node.innerHTML+="html代码";    ○若重复执行上面代码,会发生覆盖.+=则实现追加

原生js获取节点

// 1 获取元素节点 // 通过id的方式( 通过id查找元素,大小写敏感,如果有多个id只找到第一个) document.getElementById('div1'); //...
  • dl2295630178
  • dl2295630178
  • 2017年04月18日 18:02
  • 2365

JS获取节点的兄弟,父级,子级元素

先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比。 JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 ...
  • duanshuyong
  • duanshuyong
  • 2012年05月14日 00:40
  • 511103

js获取一个元素节点的子节点的方法(包括非文本节点)

先来简单复习一下: 1.文档中每个元素、属性、文字、注释、都被看做一个节点对象。 当网页被加载进了内存时,浏览器会为网页创建一个document对象,所有节点都是document对象的子节点。 ...
  • web_hua
  • web_hua
  • 2017年09月06日 20:32
  • 883

JS获取子节点、父节点和兄弟节点的若干种方式

一、js获取子节点的方式1.通过获取dom方式直接获取子节点其中test的父标签id的值,div为标签的名字。getElementsByTagName是一个方法。返回的是一个数组。在访问的时候要按数组...
  • laok_
  • laok_
  • 2017年07月22日 16:50
  • 7704

JavaScript获取节点类型、节点名称和节点值

DOM节点信息包括节点类型(nodeType)、节点名称(nodeName)和节点值(nodeValue)。 节点类型 DOM节点中,每个节点都拥有不同的类型。 W3C规范中常用的 DO...
  • judyge
  • judyge
  • 2016年07月16日 22:45
  • 4505

JS 获取节点属性值

getAttribute()方法 通过元素节点的属性名称获取属性的值。 语法: elementNode.getAttribute(name) 说明: 1. elementNode:使用get...
  • hedafighter2011
  • hedafighter2011
  • 2015年07月03日 11:11
  • 8784

js 如何获取自定义属性的值

js 获取标准属性 用点操作符来获取。也可以用Element对象的getAttribute()函数来获取。 示例 var dataType = 当前元素对象.value; 获取自定义属性(...
  • B_qxzb
  • B_qxzb
  • 2015年11月11日 17:42
  • 20985

js如何获取元素内容

window.onload = function(){ // 抓取元素 var box = document.getElementById("box"); // 给他绑定单击事件 box.on...
  • Boke_
  • Boke_
  • 2017年06月21日 10:11
  • 2155

js如何获取文本节点的值?

两种方法: 比如有个文本节点:this is value 1、通过document对象获取: var obj=document.getElementById("test"); //非Mozil...
  • judyge
  • judyge
  • 2015年12月12日 20:43
  • 1714

js获取treeview点击节点的值

  • 2014年11月10日 22:26
  • 117KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:js获取节点
举报原因:
原因补充:

(最多只允许输入30个字)