在阅读《JS DOM 编程一书》一书时,看到getElementByTagName函数返回值为数组,然后自己验证了下,发现不是数组,而是一个可遍历的HTMLCollection对象

HTML:

    <h1>需要买什么</h1>
<p>不要忘记买以下东西</p>
<ul id='purchase'>
<li>香蕉</li>
<li>苹果</li>
<li>桃子</li>
</ul>
<div>这是你要买的东西</div>
<div id='hello'>你好</div>
<div id="info"></div>

JS:

window.onload=function(){
var divs=document.getElementsByTagName('div');
console.log(divs);
console.log(typeof divs); //object
console.log(divs instanceof Array);//返回false //由此可见,getElementsByTagName方法,返回的不是一个Array
//而是一个dom对象,可以遍历 var info=document.getElementById('info');
info.innerHTML=Object.prototype.toString.call(divs); }

控制台显示结果如下:

geteLElementsByTagName()返回值可使用for循环进行遍历,且集合内是一个一个的对象。以上面的例子为例

for(var i=0;i<divs.length;i++){
  console.log(divs[i]);
   console.log(typeof divs[i]);
}

控制台输出为:

那么如何获取HTMLCollection对象中的对象呢

方式一:通过index获取,继续上面的栗子

var div1=divs[0];
console.log(div1);
console.log(typeof div1);

输出:

方式二:通过["id"]获取

var hdiv=divs["hello"];
console.log(hdiv);
console.log(typeof hdiv);

输出为:

好读书,求甚解

document.getElementsByTagName()方法的返回值的更多相关文章

  1. 一个方法中的ajax在success中renturn一个值,但是方法的返回值是undefind?

    https://segmentfault.com/q/1010000003762379 A页面 console.log(handleData("search_list", &quo ...

  2. Controller方法的返回值

    方法的返回值1.ModelAndView这个就不多说,这是最基础的,前面定义一个ModelAndView,中途使用addObject方法添加属性,再返回.视图解析器会自动扫描到的.2.String这个 ...

  3. java中Arrays类中,binarySearch()方法的返回值问题

    最近在复习Java知识,发现果然不经常使用忘得非常快... 看到binarySearch()方法的使用时,发现书上有点错误,于是就自己上机实验了一下,最后总结一下该方法的返回值. 总结:binaryS ...

  4. SSM-SpringMVC-21:SpringMVC中处理器方法之返回值Object篇

    ------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 今天要记录的是处理方法,返回值为Object的那种,我给它分了一下类: 1.返回值为Object数值(例如1) ...

  5. Java反射机制二 获取方法的返回值或参数的泛型信息

    在使用反射机制时,我们经常需要知道方法的参数和返回值类型,很简单  ,下面上示例,示例中的两个方法非常相似 package deadLockThread; import java.lang.refle ...

  6. SpringMVC由浅入深day01_10@RequestMapping_11controller方法的返回值

    10 @RequestMapping 10.1 Url路径映射 @RequestMapping(value="/item")或@RequestMapping("/item ...

  7. 7 -- Spring的基本用法 -- 10... 获取其他Bean的属性值;获取Field值;获取任意方法的返回值

    7.10 高级依赖关系配置 组件与组件之间的耦合,采用依赖注入管理:但基本类型的成员变量值,应直接在代码中设置. Spring支持将任意方法的返回值.类或对象的Field值.其他Bean的getter ...

  8. getSqlMapClientTemplate().insert()方法的返回值问题

    insert方法的返回值     今天碰到一个问题,就是关于ibatis的insert方法的返回值的问题.在网上找了很多例子,自己也亲自试了一下. 最后得出结论:insert方法返回的是在表中插入记录 ...

  9. 【mybatis】mybatis执行一个update方法,返回值为1,但是数据库中数据并未更新,粘贴sql语句直接在数据库执行,等待好久报错:Lock wait timeout exceeded; try restarting transaction

    今天使用mybatis和jpa的过程中,发现这样一个问题: mybatis执行一个update方法,返回值为1,但是数据库中数据并未更新,粘贴sql语句直接在数据库执行,等待好久报错:Lock wai ...

随机推荐

  1. scrapy项目3:爬取当当网中机器学习的数据及价格(spider类)

    1.网页解析 当当网中,人工智能数据的首页url如下为http://category.dangdang.com/cp01.54.12.00.00.00.html 点击下方的链接,一次观察各个页面的ur ...

  2. WebStorm 在 Mac 版本的基本设置,包括 ES6、Node.js、字体大小等

    WebStorm 在 Mac 和 win 的设置有区别,便于以后用到快速查找,记之. 要设置先点击 WebStorm 字样如下图: 后点击 Preferences 字样如下图: 设置 es6 语法, ...

  3. NOIP2009靶形数独(暴搜)

    题目传送门 题目描述 小城和小华都是热爱数学的好学生,最近,他们不约而同地迷上了数独游戏,好胜的他们想用数独来一比高低.但普通的数独对他们来说都过于简单了,于是他们向Z博士请教,Z博士拿出了他最近发明 ...

  4. 探究重构代码(Code refactoring)

    Code refactoring 是什么 在不改变软件的外部行为的条件下,通过修改代码改变软件内部结构,将效率低下和过于复杂的代码转换为更高效.更简单和更简单的代码. 怎样执行Code refacto ...

  5. [Python]ctypes+struct实现类c的结构化数据串行处理

    1. 用C/C++实现的结构化数据处理 在涉及到比较底层的通信协议开发过程中, 往往需要开发语言能够有效的表达和处理所定义的通信协议的数据结构. 在这方面是C/C++语言是具有天然优势的: 通过str ...

  6. GET,POST传值总结

    GET和POST是什么?HTTP协议中的两种发送请求的方法. HTTP是什么?HTTP是基于TCP/IP的关于数据如何在万维网中如何通信的协议. 其实,GET和POST本质上两者没有任何区别.他们都是 ...

  7. python语言优势

    与Java等语言比较起来,最大优点是语法很简洁,很多功能像octave和matlab,能够对数组或矩阵进行高效处理. 比如一个数组求和,这里只要一句话sum(a),Java等语言就需要循环.还有矩阵的 ...

  8. Openstack 实现技术分解 (1) 开发环境 — Devstack 部署案例详解

    目录 目录 前言 系统环境 Devstack 下载源码 配置文件 local.conf & localrc 简易的环境脚本 openrc 部署 Devstack 自动化部署流程 部署案例 单节 ...

  9. 【释疑】tp99、单实例qps

    tp99 tp99的定义 tp99 (top percentile 99),指一组数据从小到大排列,处于99%位置的数据的值.例如等差数列range(1,101),tp99=99 tp99优于平均值的 ...

  10. JSP———数据交互【2】

    内置对象application 实现用户之间的数据共享 与session 对象不同的是,所有客户的 application 对象是相同的一个,即所有的客户共享这个内置的 application 对象 ...