事件 :

ng-click="addNews()"  所属div的层级:    div > div  >span

即,对于

event.target 查找的话最多 从span 触发ng-click="addNews()" 事件
 
即可找到含有 data-id自定义属性的div,现在我们将红色样式border 加在最顶层,这样方便我们操作元素
 
 
不管触发 的标签时哪一个,但是最终都会找到 div(即) 

 所以我们需要继续网上找两级父节点
var rowdiv = div.parentNode.parentNode;

因为我们将

所以我们继续向上找一级并循环此级的子节点(即我们需要增加样式的div组)

在设置当前border为red之前把所有的样式设为默认;然后把当前的div设置为红色。

 

angular 中同级元素交替样式的更多相关文章

  1. chrome中获取元素的样式

    以获取背景颜色为例 html部分 <div id="test">abcd</div> css部分 #test { background-color: rgb ...

  2. (知识点)JS中获取元素的样式

    首先我们已经知道了JavaScript如果获取一个元素的内部样式,你可以这样做: <div id="box" style="width:100px;height:1 ...

  3. Angular中innerHTML标签的样式不起作用详解

    1.背景 在最近angular的项目中,需要用到[innerHTML]标签来指定一个div的样式: //HTML部分 <div class="contents" [inner ...

  4. angular 中父元素ng-repeat后子元素ng-click失效

    在angular中使用ng-repeat后ng-click失效,今天在这个上面踩坑了.特此记录一下. 因为ng-repeat创造了新的SCOPE.如果要使用这个scope的话就必须使用$parent来 ...

  5. js中获取元素的样式兼容性的写法

    1:设计元素的样式:el.style.color="red"||el.style["color"]="red"  获取元素的样式:el.st ...

  6. Angular中引入Bootstrap部分样式失效以及Jquery的$无法识别

    大多数同学在模仿慕课网的时候可能会遇到引入bootstrap和jquery样式部分失效以及$符号报错,这里为大家提供正确的解决方案. 可能大家在引入试过col-md之后觉得bootstrap是ok的, ...

  7. vue 给v-html中的元素设置样式

    解决方案:写样式的时候添加>>>

  8. Jquery点击本身,修改出本身之外的其他同级元素的样式

    1.引用Jquyer库 2.Jquery代码: <script type="text/javascript"> $(function () { slidColor('d ...

  9. 12.2.1 访问元素的样式【JavaScript高级程序设计第三版】

    任何支持style 特性的HTML 元素在JavaScript 中都有一个对应的style 属性.这个style 对象是CSSStyleDeclaration 的实例,包含着通过HTML 的style ...

随机推荐

  1. 【CSS】如何在一个页面中引入样式css

    CSS(Cascading Style Sheet)又叫层叠样式表.是我们学习前端必不可少的一门语言,学习它其实就是为了学会如何去更改页面标签的样式.目前使用最广的是css3,但同样的,他是从css2 ...

  2. PHP学习(9)——错误和异常处理

    1.Exception类 这个类是PHP为异常处理提供的内置类.构造函数的两个参数分别是错误消息和错误代码. 除了构造函数之外,该类还提供了如下的内置方法: · getCode() 返回传递给构造函数 ...

  3. SpringCloud学习(一)服务的注册与发现Eureka(Finchley版本)

    创建服务注册中心 在这里,我还是采用Eureka作为服务注册与发现的组件. 首先创建一个空项目 首先创建一个空项目,再创建一个maven项目,首先创建一个主Maven工程,在其pom文件引入依赖,sp ...

  4. Stream系列(十)Count方法使用

    计数器 视频讲解: https://www.bilibili.com/video/av77905733/ EmployeeTestCase.java package com.example.demo; ...

  5. Python全栈开发之6、面向对象

    一.创建类和对象 面向对象是一种编程方式,此编程方式的实现是基于对 类 和 对象 的使用 类是一个模板,模板中包装了多个“函数”供使用(可以讲多函数中公用的变量封装到对象中) 对象,根据模板创建的实例 ...

  6. css的优先级权重

    选择器(优先级从高到低) 示例 特殊性值 !important(重要性标识) div { color: #fff !important; } 无,但为了方便记忆,可将其表示为1,0,0,0,0 行内样 ...

  7. SGI RB-tree深入理解

    前言 在学习STL源码之前我也曾无数次想要弄懂红黑数的原理,奈何每次都被困难打退.说实话,红黑树是真的很难理解,需要不断沉淀才能慢慢体会其妙处.这两天看SGI的RB-tree实现,结合侯捷老师的< ...

  8. 2019牛客暑期多校训练营(第九场)-D Knapsack Cryptosystem (折半搜索)

    题目链接:https://ac.nowcoder.com/acm/contest/889/D 题意:题意简单,从大小为36的集合中选若干元素使得他们的和为sum. 思路:第一感觉用搜索,复杂度为2^3 ...

  9. [转帖]PKI技术原理(收集 整理 归纳)

    PKI技术原理(收集 整理 归纳) https://blog.51cto.com/3layer/20430 总结归纳的 灰常好.. 7layer关注8人评论39427人阅读2007-03-14 11: ...

  10. Hive远程连接

    HIVE的连接模式== 本地连接模式 直接启动hive命令 HIVE的远程连接 这里要启动HIVE的服务 thirft进行编写 hiveserver2 —- > 前台启动 后台启动 前台启动 h ...