将 jQueryparent() 和siblings() 调用转换为纯Javascript

Question

我遇到了一些麻烦，我正在处理的网站与 jQuery 发生冲突，我不知道如何将其转换为 Javascript，或者是否可能：

$(document).ready(function(){
   $('div.links').parent('td').siblings().find('a.schedule')
});

Answer 1

这很冗长，但 JS 的冗长是我们都喜欢 jQuery 的原因之一：

var links = document.getElementsByClassName('links');

var hrefs = [];

for ( var i = 0; i < links.length; ++i )
  {
    var n = links[i];
    var pn = n.parentNode;
    
    if (n.parentNode.tagName.toLowerCase() == 'td')
      {
        var sib = n.parentNode.nextElementSibling;
        if (sib && sib.tagName.toLowerCase() == 'td')
          {
            var as = sib.getElementsByClassName('schedule');
            
            for ( var j = 0; j < as.length; ++j )
              hrefs.push(as[j]);
          }
      }     
  }

// highlight what we've found
for ( i = 0; i < hrefs.length; ++i )
  hrefs[i].className = 'selected';

.selected {
  background-color: yellow;
}

<table>
  <tr>
    <td><div class="links">links</div></td>
    <td><a href="#" class="schedule">schedule</a></td>
  </tr>
  <tr>
    <td></td>
    <td><a href="#" class="schedule">schedule</a></td>
  </tr>
  <tr>
    <td><div class="links">links</div></td>
    <td><a href="#" class="schedule">schedule</a></td>
  </tr>
  <tr>
    <td><div class="links">links</div></td>
    <td><a href="#" class="schedule">schedule</a></td>
  </tr>
  <tr>
    <td></td>
    <td><a href="#" class="schedule">schedule</a></td>
  </tr>
</table>