js如何获取某id的子标签
思路:根据id获取父对象,然后使用childNodes获取所有子对象数组,关键代码:
document.getElementById(div_id).childNodes; // 子对象数组
实例演示:点击按钮将为id为test的div标签的所有子标签添加red类,即字体显示为红色
1、HTML结构
<div id = "test">
<a href="#">我是超链接</a>
<input type="text" value="我是文本框">
<div>我是子div</div>
</div>
<input type='button' value='设置子元素样式' onclick="fun()"/>
2、css样式
.red{color:red !important;}
3、javascript代码
function fun(){
objs = document.getElementById("test").childNodes;
for(k in objs)
objs[k].className = "red";
}
4、前后对比效果如下


js如何获取某id的子标签的更多相关文章
- js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...
- JS如何获取多个相同class标签并分别再输出各自的文本
function getClass(boo) { var span = $("span.w");//获取所有的span标签 <span class="w" ...
- 原生js通过最外层id获取下面指定的子元素
需求:在vue中使用v-for循环出来的元素,设置动态id,之后获取下面的所有textarea标签 template: <table cellpadding = 2 v-for="(i ...
- Js动态获取iframe子页面的高度////////////////////////zzzz
Js动态获取iframe子页面的高度 Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 ...
- js与jquery获取父元素,删除子元素的不同方法
var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...
- 总结:如何获取同一个DIV里的多个不同子标签的值,并赋值给input?
这个问题说起来简单,但对于新手来说,也着实卡了好久,并且我在网上搜了好久没能找到合适的答案, 于是去博问问了一下,得到许多大神们的帮助与回答,接下来我就总结一下能够实现这个效果的几种方法,既为了自己更 ...
- 总结获取原生JS(javascript)的父节点、子节点、兄弟节点
关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...
- JS如何获取PHP循环中的ID
JS如何获取PHP循环中的ID kaalrz 二路公交车 结帖率:83.33% 首先抱歉,因为昨天那帖图片几次都不能用,修改到不能再次修改,今天早上回帖又提示没有这个帖,只好重发一次. 如 ...
- JS之获取子节点
在JS中获取子节点有以下几种方法: firstElementChild.firstChild.childNodes和children 我们通过一个例子来分析这几种方法的区别(获取div下的p标签) 输 ...
随机推荐
- Vue渲染原理
现在基本所有的框架都已经认同这个看法——DOM应尽可能是一个函数式到状态的映射.状态即是唯一的真相,而DOM状态只是数据状态的一个映射.如下图所示,所有的逻辑尽可能在状态的层面去进行,当状态改变的时候 ...
- c++运行程序闪退
以最简单程序为例 法一:在主函数末尾下一行getchar();即可.需要注意的是这种方法并不适合所有程序, 法二:<1>先在程序开头加上头文件#includ ...
- Linux学习笔记记录(五)
- gulp-file-include 合并 html 文件
gulp-file-include 是 gulp 插件,它提供了一个 include 方法让我们可以像后端模板那样把公共部分的页面导入进来. 安装依赖包(包括了 gulp-file-include 和 ...
- PHP 结合前端 ajax 爬取网站信息后, 向指定用户发送指定短信;
<?php /** * Description * @authors Your Name (you@example.org) * # 根据时时彩的最新一期的号码, 判断如果为首尾同号则发送短信 ...
- java 十四周总结
- 《编译原理》构造 LL(1) 分析表的步骤 - 例题解析
<编译原理>构造 LL(1) 分析表的步骤 - 例题解析 易错点及扩展: 1.求每个产生式的 SELECT 集 2.注意区分是对谁 FIRST 集 FOLLOW 集 3.开始符号的 FOL ...
- vue.js中的路由vue-router2.0使用
在我们平时工作中,我们有时候会有需求,按照不同的规则,加载不同的组件,页面不去跳转,常见的操作是ajax的异步操作,实现局部刷新加载新数据 在vue中,我们写了很多不同的组件,这时候,实现不刷新调用新 ...
- J2EE 课件3 JSP标记
•JSP标记包括指令标记.动作标记和自定义标记.其中自定义标记主要讲述与Tag文件有关的Tag标记 1.指令标记page page 指令用来定义整个JSP页面的一些属性和这些属性的值,属性值用单 ...
- Cocos2d-X中的菜单
在Cocos2d-X实现显示菜单的方式比較特殊,首先须要使用CCMenu创建一个菜单,然后使用CCMenuItem创建一个菜单项,实际上程序中显示的菜单是使用CCMenu和CCMenuItemFont ...