思路:根据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的子标签的更多相关文章

  1. js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选

    转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...

  2. JS如何获取多个相同class标签并分别再输出各自的文本

    function getClass(boo) { var span = $("span.w");//获取所有的span标签 <span class="w" ...

  3. 原生js通过最外层id获取下面指定的子元素

    需求:在vue中使用v-for循环出来的元素,设置动态id,之后获取下面的所有textarea标签 template: <table cellpadding = 2 v-for="(i ...

  4. Js动态获取iframe子页面的高度////////////////////////zzzz

    Js动态获取iframe子页面的高度   Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 ...

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

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

  6. 总结:如何获取同一个DIV里的多个不同子标签的值,并赋值给input?

    这个问题说起来简单,但对于新手来说,也着实卡了好久,并且我在网上搜了好久没能找到合适的答案, 于是去博问问了一下,得到许多大神们的帮助与回答,接下来我就总结一下能够实现这个效果的几种方法,既为了自己更 ...

  7. 总结获取原生JS(javascript)的父节点、子节点、兄弟节点

    关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...

  8. JS如何获取PHP循环中的ID

    JS如何获取PHP循环中的ID  kaalrz 二路公交车    结帖率:83.33%   首先抱歉,因为昨天那帖图片几次都不能用,修改到不能再次修改,今天早上回帖又提示没有这个帖,只好重发一次. 如 ...

  9. JS之获取子节点

    在JS中获取子节点有以下几种方法: firstElementChild.firstChild.childNodes和children 我们通过一个例子来分析这几种方法的区别(获取div下的p标签) 输 ...

随机推荐

  1. [luogu3573 POI2014] RAJ-Rally (拓扑排序 权值线段树)

    传送门 Solution 在DAG中我们可以\(O(n)\)预处理\(Ds(u)\)表示从u表示以s为起点的最长路\(Dt(u)\)表示以u为终点的最长路,那么经过\((u,v)\)的最长路即为\(D ...

  2. CentOS \Linux 6版本系统命令及其使用详解

    概述 常用的linux命令,分为文件管理.磁盘管理.用户管理.软件管理.系统管理等. 文件管理 ls命令 使用权限:所有使用者 使用方式:ls [-alrtAFR] [name...] 说明:显示指定 ...

  3. 利用 Python 批量修改文件名

    开发的第一步,首先得熟悉脚本中使用的模块函数,废话不多说,开干! 1 函数介绍 1.1 os 模块 (1)os.lisdir() >>> import os >>> ...

  4. POJ 3468 线段树区间修改查询(Java,c++实现)

    POJ 3468 (Java,c++实现) Java import java.io.*; import java.util.*; public class Main { static int n, m ...

  5. 【BZOJ 1013】球形空间产生器sphere(高斯消元)

    球形空间产生器sphere HYSBZ - 1013 (高斯消元) 原题地址 题意 给出n维的球上的n个点,问原球体球心. 提示 n维球体上两点距离公式\(dist = \sqrt{ (a1-b1)^ ...

  6. 【Codeforces 1096D】Easy Problem

    [链接] 我是链接,点我呀:) [题意] 让你将一个字符串删掉一些字符. 使得字符串中不包含子序列"hard" 删掉每个字符的代价已知为ai 让你求出代价最小的方法. [题解] 设 ...

  7. Java基础学习总结(83)——Java泛型总结

    1. 什么是泛型? 泛型(Generic type 或者 generics)是对 Java 语言的类型系统的一种扩展,以支持创建可以按类型进行参数化的类.可以把类型参数看作是使用参数化类型时指定的类型 ...

  8. D. Palindromic characteristics

    time limit per test 3 seconds memory limit per test 256 megabytes input standard input output standa ...

  9. 最小生成树 E - QS Network

    Sunny Cup 2003 - Preliminary Round April 20th, 12:00 - 17:00 Problem E: QS Network In the planet w-5 ...

  10. Codeforces 303A(构造)

    题意:对0到(n-1)这n个数进行全排列.请找出三个全排列a.b.c,使得“a与b的对应元素的和”与“c的对应元素”对模n同余,无解输出-1.(n<=1e5) 分析:n为奇数有解,n为偶数无解 ...