首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

获取被点击元素的同级元素和removeClass纯javascript或没有指令的angular js

获取被点击元素的同级元素可以使用纯JavaScript或没有指令的AngularJS来实现。下面是两种方法的详细说明:

  1. 纯JavaScript方法:
    • 首先,通过事件监听器(如click事件)获取被点击的元素。可以使用document.querySelectordocument.getElementById等方法选择元素。
    • 然后,使用parentNode属性获取被点击元素的父节点。
    • 最后,使用childNodes属性获取父节点的所有子节点,再通过遍历筛选出同级元素。

示例代码如下:

代码语言:javascript
复制

document.addEventListener('click', function(event) {

代码语言:txt
复制
 var clickedElement = event.target; // 获取被点击的元素
代码语言:txt
复制
 var parentElement = clickedElement.parentNode; // 获取父节点
代码语言:txt
复制
 var siblings = Array.from(parentElement.childNodes).filter(function(node) {
代码语言:txt
复制
   return node.nodeType === 1 && node !== clickedElement; // 筛选出同级元素
代码语言:txt
复制
 });
代码语言:txt
复制
 console.log(siblings); // 输出同级元素数组

});

代码语言:txt
复制
  1. 没有指令的AngularJS方法:
    • 首先,在HTML中使用ng-click指令绑定一个点击事件,并传递被点击的元素作为参数。
    • 然后,在控制器中定义点击事件的处理函数,通过传入的参数获取被点击的元素。
    • 最后,使用angular.element函数获取被点击元素的父节点,再使用children方法获取所有子元素,再通过遍历筛选出同级元素。

示例代码如下:

代码语言:html
复制

<div ng-app="myApp" ng-controller="myCtrl">

代码语言:txt
复制
 <button ng-click="getSiblings($event.target)">点击获取同级元素</button>

</div>

代码语言:txt
复制
代码语言:javascript
复制

angular.module('myApp', [])

代码语言:txt
复制
 .controller('myCtrl', function($scope) {
代码语言:txt
复制
   $scope.getSiblings = function(clickedElement) {
代码语言:txt
复制
     var parentElement = angular.element(clickedElement).parent(); // 获取父节点
代码语言:txt
复制
     var siblings = parentElement.children().filter(function() {
代码语言:txt
复制
       return this !== clickedElement; // 筛选出同级元素
代码语言:txt
复制
     });
代码语言:txt
复制
     console.log(siblings); // 输出同级元素数组
代码语言:txt
复制
   };
代码语言:txt
复制
 });
代码语言:txt
复制

这两种方法都可以获取被点击元素的同级元素,并且不依赖于特定的云计算品牌商。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券