如何通过来自不同父元素的相同元素查找 HTML 元素

How to find a HTML element by same element from different parent element?

本文关键字:元素 查找 HTML 何通过      更新时间:2023-09-26

我需要通过相同的元素选择一个元素,父元素是不同的(哪些元素包含相同的属性和值),而无需使用循环。例如

Code is: 杰斯菲德尔

请建议我以任何其他方式获取元素。

如果我正确理解了你的问题,你基本上想从两组tuples中得到元素的交集

尝试

$(variable1st).find("Tuple").filter($(var2nd).find( "Tuple" ));

var tupleSet1 = $(variable1st).find( "Tuple" );
var tupleSet2 = $(var2nd).find( "Tuple" );
var finalOutput = tupleSet1.filter(function(el) {
    return tupleSet2.indexOf(el) != -1
});

将您的小提琴更新为

function change(){
   var tuple1 = $("#var1")[0].outerHTML;
   console.log($(tuple1).find("tuple"));
   var tuple2 = $("#var2")[0].outerHTML;
   console.log($(tuple2).find("tuple"));
   var commonTuples = $(tuple1).find("tuple").filter( function(i,v){
      console.log( v.outerHTML );
      console.log( tuple2.indexOf( v.outerHTML ) );
        return tuple2.indexOf( v.outerHTML ) != -1 ;
   } );    
   alert( commonTuples.text() );
 }

如果您正在寻找具有匹配div id 的第一个元组,那么这应该可以工作。

这是jsfiddle

var var1st = $("#first");
var var2nd = $("#second");
var match = var1st.find("#" + var2nd.find("Tuple:first-child > div").attr("id")).parent();
var (match.html());
<Tuples id="first">
  <Tuple>
    <div id="1"></div>
  </Tuple>
  <Tuple>
    <div id="2"></div>
  </Tuple>
  <Tuple>
    <div id="3"></div>
  </Tuple>
  <Tuple>
    <div id="4"></div>
  </Tuple>
</Tuples>
<Tuples id="second">
  <Tuple>
    <div id="1"></div>
  </Tuple>
  <Tuple>
    <div id="2"></div>
  </Tuple>
</Tuples>

ID 在

文档中应该是唯一的,即您不能为两个元素提供相同的 ID。

而是给出相同的类名,例如

<tuple>
  <div class="1">1st</div>
</tuple>

然后可以直接选择 $(".1")。这将返回具有相同类名的节点数组。您可以循环访问此数组并获取文本。希望这有帮助。