//使用firstChild
//但是下面这种因为有空格,也算其子元素
<lable>
<span id="onlinePerson" name="person" onclick="changeImg(this)" >
<img id="imgPerson" src="data:images/invote-checked.png">个人
</span>
</lable> //所以要改成这样,去掉空格
<lable>
<span id="onlinePerson" name="person" onclick="changeImg(this)" ><img id="imgPerson" src="data:images/invote-checked.png">个人</span>
</lable>

以上为html, js部分如下,这个是点击切换图片的例子

var isClick = false;
function changeImg(obj) {
invoteOnline.getElementsByTagName("img")[0].src = "images/invote-nochecked.png"
if(isClick){
imgPerson.src = "images/invote-checked.png";
imgCompany.src = "images/invote-nochecked.png";
isClick = false
}else {
imgPerson.src = "images/invote-nochecked.png";
imgCompany.src = "images/invote-checked.png";
isClick = true;
}
console.log(obj.firstChild); //查找元素的子元素,注意空格
console.log(obj.getAttribute("name"));//获取name
return false;
}

效果如下

原生js获取元素的子元素的更多相关文章

  1. js与jquery获取父元素,删除子元素的不同方法

    var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...

  2. 原生js获取元素样式

    摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...

  3. 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题

    1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...

  4. 原生js获取元素的样式信息

    工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...

  5. jquery选择器 之 获取父级元素、同级元素、子元素

    jquery选择器 之 获取父级元素.同级元素.子元素 一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 <div id="par_div" ...

  6. jquery选择器 之 获取父级元素、同级元素、子元素 - yes的日志 - 网易博客

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  7. JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )

    1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...

  8. 在Js中得到元素的子元素集合注意事项

    http://www.cnblogs.com/phonefans/archive/2008/09/04/1283739.html 在Js中得到元素的子元素集合注意事项 费话少说,直接看例子: 1 &l ...

  9. jquery选择器如何获取父级元素、同级元素、子元素

    一.新建页面 <ul> <li>list item 1</li> <li>list item 2</li> <li class=&qu ...

随机推荐

  1. 深入了解scanf()/getchar()和gets()/cin等函数

    转:http://www.cnblogs.com/FCWORLD/archive/2010/12/04/1896511.html 转:问题描述一:(分析scanf()和getchar()读取字符) s ...

  2. Servlet 知识点总结(来自那些年的笔记)

    2018年04月15日 20:16:01 淮左白衣 阅读数:350   版权声明:转载请给出原文链接 https://blog.csdn.net/youngyouth/article/details/ ...

  3. MaC 修改MySQL密码

    1.苹果->系统偏好设置->最下边点mysql 在弹出页面中 关闭mysql服务(点击stop mysql server) 2.进入终端输入:cd /usr/local/mysql/bin ...

  4. QTP - 工作原理

    1.QTP的工作原理测试对象是QTP在测试或组件中创建的用于表示应用程序中的实际对象的对象,并且QuickTest在对象库中存储有关该对象的信息,包括对象的属性.操作等.录制的时候,QTP将操作过的所 ...

  5. 微信调用itchat库 实现发消息

    import itchat,timefrom itchat.content import * itchat.auto_login(enableCmdQR=-1)while True: for i in ...

  6. python_05 可变类型与不可变类型、集合、字符串格式化

    可变数据类型与不可变数据类型: 1.可变:列表,字典 2.不可变:字符串,数字,元组 访问顺序: 1.顺序访问:字符串,列表,元组 2.映射:字典 集合 由不同元素组成的集合,集合中是一组无序排列的可 ...

  7. Nmap扫描命令使用详解

    Nmap扫描基础扫描 当用户对Nmap工具了解后,即可使用该工具实施扫描.通过上一章的介绍,用户可知Nmap工具可以分别对主机.端口.版本.操作系统等实施扫描.但是,在实施这些扫描工作之前,需要先简单 ...

  8. 【原创】python嗅探QQ消息实战

    目录 需求分析 选型 设计与流程 实现过程 结果展示 1 需求分析   在一些业务场景中需要拿到IM上的通信记录来做一些数据分析,例如对QQ平台中的消息进行领域分类等. 2 选型 环境与工具: pyt ...

  9. Secondary Indices

    [Secondary Indices] EOSIO has the ability to sort tables by up to 16 indices.  A table's struct cann ...

  10. python--第十二天总结(Python操作 RabbitMQ、Redis、Memcache、SQLAlchemy)

    Memcached Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高动态.数据库驱动网站的速度 ...