JavaScript节点的方式修改元素的背景颜色

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        div {
            width: 300px;
            height: 400px;
            border: 1px solid red;
        }
    </style>
</head>
<body>
<input type="button" value="显示效果" id="bt"/>
<div id="dv">
    <span>我是span</span>
    <p>我是p</p>
    <span>我是span</span>
    <p>我是p</p>
    <span>我是span</span>
    <p>我是p</p>
    <span>我是span</span>
    <p>我是p</p>
    <span>我是span</span>
    <a href="http://www.baidu.com">百度</a>
</div>
<script src="common.js"></script>
<script>
    my$("bt").onclick = function () {
      //先获取div
        var dvObj = document.getElementById("dv");
        //获取里面的所有子节点
        var nodes = dvObj.childNodes;
        //循环遍历所有的子节点
        for(var i = 0; i < nodes.length; i++) {
            //判断这个子节点是不是p标签
            if(nodes[i].nodeType == 1 && nodes[i].nodeName == "P") {
                nodes[i].style.backgroundColor = "red";
            }
        }
    };
</script>
</body>
</html>

原文地址:https://www.cnblogs.com/cuilichao/p/9374856.html

时间: 2024-10-13 10:23:03

JavaScript节点的方式修改元素的背景颜色的相关文章

如何为元素设置背景颜色

1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 4 <style type="text/css"> 5 6 body {background-color: yellow} 7 h1 {background-color: #00ff00} 8 h2 {background-color: transparent} 9 p {background-color: rgb(2

ios修改NavigationController的背景颜色

在ios开发的过程中,我们经常需要修改NavigationController的背景颜色,当使用方法[self.navigationController.navigationBar setBackgroundColor:[UIColor redColor]]时,运行的结果并不能修改北京颜色: 现在提供一种新方法来解决这个问题: 写一个NavigationBar写一个类别: @interface UINavigationBar (BackgroundColor) //设置navigationBar

JavaScript 节点分类与获取元素的方法

节点: 在DOM中有许多不同类型的节点.主要分为三类:元素节点,文本节点,属性节点. 元素节点: 像<body>,<p>,<ul>之类的元素. 文本节点:像<p>This is an example</p>.其中This is an example 是一个文本节点.文本节点总是被包含在元素节点的内部. 属性节点: 属性节点用来对元素做出更具体的描述.例如,几乎所有的元素都有一个title属性,<p title="an exampl

【BIRT】修改BIRT的背景颜色

修改BIRT报表的背景颜色都在这里了 在BIRT的webcontent/birt/styles/目录下有如下文件列表: dialogbase.css文件修改 dialogbase_rtl.css文件修改   style.css文件修改 修改一: 修改二: 以上是根据自我需求修改,如果需要修改其他颜色,或特定位置颜色,参看css文件具体定制即可. 原文地址:https://www.cnblogs.com/OliverQin/p/9597543.html

VC OnCtlColor函数来修改控件背景颜色

CWnd::OnCtlColor afx_msg HBRUSH OnCtlColor( CDC* pDC, CWnd* pWnd, UINT nCtlColor ); 返回值:OnCtlColor必须返回一个刷子句柄,该刷子将被用于画出控件的背景. 参数: pDC 包含了子窗口的显示设备环境的指针.可能是临时的. PWnd 包含了要求颜色的控件的指针.可能是临时的. NCtlColor 包含了下列值,指定了控件的类型: · CTLCOLOR_BTN 按钮控件 · CTLCOLOR_DLG 对话框

JavaScript节点的方式隔行变色

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="button" value="变色" id="bt"/> <ul id="

修改UISearchBar的背景颜色

当你看到这篇博客你就已经发现了用_searchBar.backgroundColor = [UIColor clearColor];来设置UISearchBar的颜色完全没有效果: 并且,有些方法是想通过遍历出UISearchBarBackground来移除它实现背景透明,也并没有什么卵用. 下面这个方法,你不用纠结它是怎么实现的,直接复制拿去用: _searchBar.backgroundImage = [self imageWithColor:[UIColor clearColor] siz

如何修改Eclipse的背景颜色

一.设置方式 结果如下:

PHPStorm怎么修改选中的背景颜色呢?

File -> Settings -> editor ->color&fonts->general->下拉框中的selection background->点击后边的小方框框选择你喜欢的颜色即可 ps:有些主题的选中颜色很淡,这个操作还是蛮实用的.