我正在尝试获取元素的innerHTML，但它返回未定义。
let body = e.target.previousElementSibling.innerHTML;
console.log(body);
//返回未定义
但是，当我这样做时：
let body = e.target.previousElementSibling;
并通过控制台记录下来，
它返回给我元素，即：
<p class="card-text"> is the greatest </p>
所以为什么innerHTML返回未定义？
这里是HTML：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Microposts</title>
<body>
<div id="posts">
<div class="card-body 4" data-id="4">
<h4 class="card-title"> code </h4>
<p class="card-text"> why is this </p>
<i class="fa fa-pencil 4"> </i>
<i class="fa fa-remove 4 " style="margin-left:30px"> </i>
</div>
<div class="card-body 5" data-id="5">
<h4 class="card-title"> messi </h4>
<p class="card-text"> is the greatest </p>
<i class="fa fa-pencil 5"> </i>
<i class="fa fa-remove 5 " style="margin-left:30px"> </i>
</div>
<div class="card-body 6" data-id="6">
<h4 class="card-title"> Why is the compiler showing following code as incorrect syntax? </h4>
<p class="card-text"> I dont know </p>
<i class="fa fa-pencil 5"> </i>
<i class="fa fa-remove 5 " style="margin-left:30px"> </i>
</div>
</div>
</body>
</html>
这是JS代码
document.querySelector("#posts").addEventListener("click", postUpdate);
function postUpdate(e) {
if (e.target.classList.contains("fa-pencil")) {
let id = e.target.parentElement.dataset.id;
let element = e.target.parentElement;
let body = e.target.previousElementSibling.innerHTML;
let title = body.previousElementSibling.innerHTML;
console.log(body);
}
}
而不是：
let body = e.target.previousElementSibling.innerHTML;
let title = body.previousElementSibling.innerHTML;
执行：
let body = e.target.previousElementSibling.innerHTML;
let title =e.target.previousElementSibling.previousElementSibling.innerHTML;