getElementByID,getElementsByName,getElementsByTagName

<input type="checkbox" name="hobby" id="hobby1">  音乐
  <input type="checkbox" name="hobby" id="hobby2">  登山
  <input type="checkbox" name="hobby" id="hobby3">  游泳
  <input type="checkbox" name="hobby" id="hobby4">  阅读
  <input type="checkbox" name="hobby" id="hobby5">  打球
  <input type="checkbox" name="hobby" id="hobby6">  跑步
  <input type="button" value = "全选" id="button1">
  <input type="button" value = "全不选" id="button1">

1. document.getElementsByTagName("input"),结果为获取所有标签为input的元素,共8个。

2. document.getElementsByName("hobby"),结果为获取属性name="hobby"的元素,共6个。

3. document.getElementById("hobby6"),结果为获取属性id="hobby6"的元素,只有一个,"跑步"这个复选项。

时间: 2024-10-12 20:43:45

getElementByID,getElementsByName,getElementsByTagName的相关文章

(4.17)getElementByID,getElementsByName,getElementsByTagName的区别

<form> <input type="checkbox" name="hobby" id="hobby1"/>音乐 <input type="checkbox" name="hobby" id="hobby2"/>登山 <input type="checkbox" name="hobby" id=&quo

区别getElementByID,getElementsByName,getElementsByTagName

以人来举例说明,人有能标识身份的身份证,有姓名,有类别(大人.小孩.老人)等. 1. ID 是一个人的身份证号码,是唯一的.所以通过getElementById获取的是指定的一个人. 2. Name 是他的名字,可以重复.所以通过getElementsByName获取名字相同的人集合. 3. TagName可看似某类,getElementsByTagName获取相同类的人集合.如获取小孩这类人,getElementsByTagName("小孩"). 把上面的例子转换到HTML中,如下:

玩转DOM遍历——用NodeIterator实现getElementById,getElementsByTagName方法

先声明一下DOM2中NodeIterator和TreeWalker这两类型真的只是用来玩玩的,因为性能不行遍历起来超级慢,在JS中基本用不到它们,除了<高程>上有两三页对它的讲解外,谷歌的学习资料也是甚少(倒是有挺多国外文章)...由于本着不放过任何知识的态度,结合着自己的理解学习了下这两玩意,你们对这两东西了解了解就好~ DOM2级遍历和范围模块定义了两个用于完成顺序遍历DOM结构的类型:NodeIterator和TreeWalker.这两类型基于给定起点对DOM结构执行深度优先先序遍历,兼

认识DOM(上)

认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title

DOM对象控制HTML无素——详解1

getElementsByName()方法 返回带有指定名称的节点对象的集合. 语法: document.getElementsByName(name) 与getElementById() 方法不同的是,通过元素的 name 属性查询元素,而不是通过 id 属性. 注意: 1. 因为文档中的 name 属性可能不唯一,所有 getElementsByName() 方法返回的是元素的数组,而不是一个元素. 2. 和数组类似也有length属性,可以和访问数组一样的方法来访问,从0开始. 1 <bo

Javascript重要知识点梳理

Javascript重要知识点梳理 说明 Javascript流程控制 js中常用的数据类型 var关键字的使用 if – else if – else switch while for Javascript常用函数 1.  字符串函数 substring indexOf lastIndexOf charAt replace split toLowerCase toUpperCase 2.  数学运算函数 3.  数据类型转换函数 parseInt parseFloat Math.abs Mat

JS获取网页中HTML元素的几种方法分析

getElementById getElementsByName getElementsByTagName 大概介绍 getElementById ,getElementsByName ,getElementsByTagName ###adv### 后两个是得到集合,byid只是得到单个对象 getElementById 的用法 举个例子: <a id="link1" name="link1" href=http://homepage.yesky.com>

js操作dom对象

属性: 1Attributes     存储节点的属性列表(只读) 2childNodes     存储节点的子节点列表(只读) 3dataType     返回此节点的数据类型 4Definition     以DTD或XML模式给出的节点的定义(只读) 5Doctype     指定文档类型节点(只读) 6documentElement     返回文档的根元素(可读写) 7firstChild     返回当前节点的第一个子节点(只读) 8Implementation     返回XMLD

[转载]页面优化——网页优化

前端是庞大的,包括HTML.CSS.Javascript.Image.Flash等等各种各样的资源.前端优化是复杂的,针对方方面面的资源都有不同的方式.那么,前端优化的目的是什么 1. 从用户角度而言,优化能够让页面加载得更快.对用户的操作响应得更及时,能够给用户提供更为友好的体验. 2. 从服务商角度而言,优化能够减少页面请求数.或者减小请求所占带宽,能够节省可观的资源. 总之,恰当的优化不仅能够改善站点的用户体验并且能够节省相当的资源利用. 前端优化的途径有很多,按粒度大致可以分为两类,第一