javascript - 如何通过事件目标获取上一个元素?
问题描述
我正在尝试div/ class/ wrapper/ container
通过event.target
React javascript 获取上一个。它是一张桌子,这是DOM
树。当我单击带有“1”的单元格时,event.target 将输出
<div class="id">
<span>1</span>
</div>
我怎样才能让它输出<div class="Table row">
呢?谢谢
桌子:
id name location
1 test test #the below html dom is for this row
DOM:
<div class="Table row" custom_att="test">
<div class="id">
<span>1</span>
</div>
<div class="name">
<span>test</span>
</div>
<div class="location">
<span>test</span>
</div>
</div>
代码:
onMouseDownEvent(e){
var ele = e.target;
//do something with ele
}
解决方案
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>event.target demo</title>
<style>
span, strong, p {
padding: 8px;
display: block;
border: 1px solid #999;
}
</style>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
<div class="Table row">
<div class="id">
<span>1</span>
</div>
<div class="name">
<span>test</span>
</div>
<div class="location">
<span>test</span>
</div>
</div>
<div id="log">
</div>
<script>
$( "body" ).click(function( event ) {
$( "#log" ).html( "clicked: " + event.target.parentNode.nodeName );
});
</script>
</body>
</html>
推荐阅读
- ruby-on-rails - Docker、Rails 和 Sidekiq - 捆绑器:找不到命令:sidekiq - 将 sidekiq 作为单独的容器运行
- azure - 如何为包含卷的 Azure 容器注册表部署简单的多容器应用程序?
- scala - 为什么 Source.fromInputStream 使用 GZIPInputStream 而不是 ZipInputStream
- c# - 适配器是否将中间件管道数量限制为仅允许 2 个 IMiddleware 与 Use() 一起使用?
- postgresql - 从 timescaledb 切换到 influxdb - 如何组织数据?(许多数据点,每个查询都通过给定的设备 ID 获取所有数据)
- r - 如何从汽车对汽车的模拟中获得正态概率分布?
- java - 如何将单词存储为 TreeMap 中的键?
- python - 或者工具 cp_model 知道哪个约束失败了
- typescript - 更有用的打字稿字典类型:警告访问的项目可能未定义
- angular - 如何合并多个 Observable 响应