Javascript 为什么我需要4个以前的兄弟姐妹才能得到2个以前的元素？_Javascript_Html_Dom

Javascript 为什么我需要4个以前的兄弟姐妹才能得到2个以前的元素？

javascript html dom

Javascript 为什么我需要4个以前的兄弟姐妹才能得到2个以前的元素？,javascript,html,dom,Javascript,Html,Dom,在本例中，我希望获得前两个兄弟的值但这不起作用btn.previousSibling.previousSibling.value 我需要使用4个以前的同级来获取值，为什么是4 <!DOCTYPE HTML> <html> <head> <script> function text(btn){ console.log(btn.previousSibling.previousSibling.previousSibling.previousSi

在本例中，我希望获得前两个兄弟的值

但这不起作用

btn.previousSibling.previousSibling.value

我需要使用4个以前的同级来获取值，为什么是4

<!DOCTYPE HTML>
<html>
<head>
<script>
function text(btn){
    console.log(btn.previousSibling.previousSibling.previousSibling.previousSibling.value)
}
</script>
</head>
<body>
    <textarea></textarea>
    <br>
    <button onclick="text(this)">text</button>
</body>
</html>


功能文本（btn）{
日志（btn.previousSibling.previousSibling.previousSibling.previousSibling.value）
}


文本

这可能是因为浏览器插入了空条目：

此代码适用于您的情况：

<!DOCTYPE HTML>
<html>
<head>
<script>
function text(btn){
    alert(btn.previousSibling.previousSibling.value);
}
</script>
</head>
<body>
    <textarea>test text</textarea><br><button onclick="text(this)">text</button>
</body>
</html>


功能文本（btn）{
警报（btn.previousSibling.previousSibling.value）；
}
测试文本
文本

您可以使用JQuery$（btn.prev（）.prev（）

比如：

<!DOCTYPE HTML>
<html>
<head>
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
</script>
<script>
function text(btn){
    alert($(btn).prev().prev().val());
}
</script>
</head>
<body>
    <textarea>test text</textarea>
<br>
<button onclick="text(this)">text</button>
</body>
</html>


功能文本（btn）{
警报（$（btn.prev（）.prev（）.val（））；
}
测试文本


文本

previousSibling

指向上一个

节点

，它是示例中的新行（一个

TextNode

）。您可能想改用

previousElementSibling

功能文本（btn）{
console.log(
btn
.PreviousElement兄弟姐妹
.PreviousElement兄弟姐妹
价值
);
}

你好

text原因在于

br

元素。您可以使用

parentNode

和

queryselector

获取父元素以获取特定元素

功能文本（btn）{
var getText=btn.parentNode.querySelector（'textarea'）.value；
console.log（getText.trim（））
}




text

预期输出是什么？我找不到他的四个兄弟姐妹button@brk他在问..要得到文本框的结果。。。为什么我们需要4x

previousSibling

属性与文本节点有关，如果删除缩进，在标签周围输入和空格

直到

它将按您的要求工作intended@HimanshuBansal文本框的位置是指

文本区域

？@CL所以第一个同级是按钮..第二个是文本..第三个是br..然后第四个是文本区域..从中获取值