原生js获取元素的子元素
//使用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获取元素的子元素的更多相关文章
- js与jquery获取父元素,删除子元素的不同方法
var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...
- 原生js获取元素样式
摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...
- 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题
1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...
- 原生js获取元素的样式信息
工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...
- jquery选择器 之 获取父级元素、同级元素、子元素
jquery选择器 之 获取父级元素.同级元素.子元素 一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 <div id="par_div" ...
- jquery选择器 之 获取父级元素、同级元素、子元素 - yes的日志 - 网易博客
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
- 在Js中得到元素的子元素集合注意事项
http://www.cnblogs.com/phonefans/archive/2008/09/04/1283739.html 在Js中得到元素的子元素集合注意事项 费话少说,直接看例子: 1 &l ...
- jquery选择器如何获取父级元素、同级元素、子元素
一.新建页面 <ul> <li>list item 1</li> <li>list item 2</li> <li class=&qu ...
随机推荐
- Quartz入门及简单实现
Quartz简介 Quartz是一个功能丰富的开源作业调度库,可以集成到几乎任何Java应用程序中 - 从最小的独立应用程序到最大的电子商务系统.Quartz可以用来创建执行数十,数百乃至数万个作业的 ...
- 44个Java代码性能优化总结
https://blog.csdn.net/xiang__liu/article/details/79321639 ---稍后有时间整理
- 5种必会的Java异步调用转同步的方法你会几种
转载请注明本文地址:https://www.jianshu.com/p/f00aa6f66281 源码地址:https://gitee.com/sunnymore/asyncToSync Sunny先 ...
- (4)网络配置及CRT远程连接
修改linux虚拟机中某一网卡的网络配置: 打开终端,输入命令vi /etc/sysconfig/network-scripts/ifcfg-eth0 在文件中写入以下内容: (这里有个错误,DNS要 ...
- 4-29 c语言之栈,队列,双向链表
今天学习了数据结构中栈,队列的知识 相对于单链表来说,栈和队列就是添加的方式不同,队列就相当于排队,先排队的先出来(FIFO),而栈就相当于弹夹,先压进去的子弹后出来(FILO). 首先看一下栈(St ...
- 6.Python enumerate 特性
enumerate()可参考: list1 = ["这", "是", "一个", "测试"] for index,ite ...
- vue 解决 打包完iE下空白
安装 npm install --save babel-polyfill 在package.json中添加依赖, devDependencies:{ … "babel-polyfill&qu ...
- Spark 基础之SQL 快速上手
知识点 SQL 基本概念 SQL Context 的生成和使用 1.6 版本新API:Datasets 常用 Spark SQL 数学和统计函数 SQL 语句 Spark DataFrame 文件保存 ...
- 大数据入门到精通8-spark RDD 复合key 和复合value 的map reduce操作
一.做基础数据准备 这次使用fights得数据. scala> val flights= sc.textFile("/user/hdfs/data/Flights/flights.cs ...
- FortiGate路由模式--静态地址线路上网配置
1.需求:外网接口使用专线,由运营商分配指定的静态地址,内网为192.168.1.0/24网段,实现基本上网功能. 运营商分配ip地址:202.1.1.10,网关地址:202.1.1.9, DNS:2 ...