如何通过 <tag> 定位比前一个元素更靠后的前一个元素子元素？

Question

我遇到的问题是将下面 HTML 中输入标签中的文本与复制该文本（单词）的按钮作为目标。我需要对 JS 进行哪些更改才能使其针对该输入值？

我想在不使用 ID 的情况下执行此操作 - 因为我计划多次复制它并且不想为输入标签设置单独的 ID。

如果有一种方法可以引用 Class - 'columns-small-8' - 子元素，那么也许可以吗？

提前致谢

JS

<script> 

window.onload=function(){
let btns = document.getElementsByTagName("button")
Array.from(btns).forEach(ele => {
  ele.addEventListener("click", function() {
   jimsFunction(this)
  });
})  
function jimsFunction(input) {
  let x = input.previousElementSibling
  let ele = x.previousElementSibling
  ele.select()
  ele.setSelectionRange(0, 99999)
  navigator.clipboard.writeText(ele.value)
  alert("Copied: " + ele.value)
}}

</script>

HTML

       <div>
          <div class="row collapse">
            <div class="columns small-8">
              <input type="text" value="words" readonly>
            </div>
            <div class="columns small-2">
              <a class="button full-width secondary" href="www.google.com" 
              target="_blank">View</a>                                
            </div>
            <div class="columns small-2">
              <button type="button" class="button full-width secondary">Copy URL</button>
            </div>
          </div>
        </div>

Answer 1

使用您的 html 结构，您可以调用它的父级，就像 :

window.onload=function(){
let btns = document.getElementsByTagName("button")
Array.from(btns).forEach(ele => {
  ele.addEventListener("click", function() {
   jimsFunction(this)
  });
})  
function jimsFunction(input) {
  let x = input.parentElement.parentElement
  let ele = x.firstElementChild.firstElementChild
  ele.select()
  ele.setSelectionRange(0, 99999)
  navigator.clipboard.writeText(ele.value)
  alert("Copied: " + ele.value)
}}

<div>
  <div class="row collapse">
    <div class="columns small-8">
      <input type="text" value="words" readonly>
    </div>
    <div class="columns small-2">
      <a class="button full-width secondary" href="www.google.com" 
      target="_blank">View</a>                                
    </div>
    <div class="columns small-2">
      <button type="button" class="button full-width secondary">Copy URL</button>
    </div>
  </div>
</div>

如何通过 <tag> 定位比前一个元素更靠后的前一个元素子元素？

How do I target a previous Element child by <tag> that is further back than just the previous element?

javascript

arrays

dom

copy

button