使用jQuery在单个td中的文本节点选择器

如何解决使用jQuery在单个td中的文本节点选择器

我需要在“姓名：”，“电话”，“电子邮件”，“提交线索”，“评论”，“属性地址1”之后提取文字：

问题在于所有这些文本节点都是兄弟姐妹。我不知道如果是文本节点，如何按数字选择同级-例如顶部的同级是跨度，其余的是文本节点。我尝试了不同的迭代，但是唯一要开始工作的是 var comments = $（'span：contains（“ Renter's Information”）'）。siblings（）。text（）。trim（）; 但这会拉动所有文本，而不仅仅是注释文本。理想情况下，我不仅要获取每个文本节点，还要获取“名称：”，“电话：”等之后的文本，但是我可能不得不将其从jQuery post中删除。对于拉出这些单独的文本节点的任何指导将不胜感激。

<td align="left" style="font-family:'Lucida Grande','Lucida Sans Unicode','Lucida Sans','DejaVu Sans',Verdana,sans-serif;font-size:14px;color:#666;padding:24px">
<span style="font-size:18px;font-weight:bold;color:#333">Renter's Information</span>
<br> Name: Shelby 
<br> Phone: <a href="tel:(555)%25555-5555" style="color:#666;text-decoration:none" target="_blank">(555) 555-555</a>
<br> Email: <a href="mailto:email@gmail.com" style="color:#666;text-decoration:none" target="_blank">email@gmail.com</a>
<br> Lead Submitted: 9/13/2020 1:42:37 PM
<br>
<br> <span style="font-size:18px;font-weight:bold;color:#333">Renter's Preferences</span>
<br> Beds/Baths:
<br> Model:
<br> Unit:
<br>
<br> Move Date: 11/2/2020
<br> Comments: Hi there! Just came across your listing online. I was wondering if you could send us some updated photos and financial information,as in if anything is included in cost,how much the house needs paid off &amp; just some details so we can look to see if we want to check it out. Thank you!
<br>
<br> <span style="font-size:18px;font-weight:bold;color:#333">Property Information</span>
<br> Link: <a href="https://www.apartments.com/" style="color:#77b800;text-decoration:none" target="_blank" data-saferedirecturl="https://www.google.com/url?hl=">https://www.apartments.com/</a>
<br> To: <a href="#m_7_" style="color:#666;text-decoration:none">property</a>
<br> Property Address 1: <a href="#m_7654125587635847623_" style="color:#666;text-decoration:none">property</a>
<br> Property Address 2: <a href="#m_7654125587635847623_" style="color:#666;text-decoration:none"></a>
<br> City: city
<br> State: NY
<br> Zip: 12345
<br>
<br> <span style="font-weight:bold">Wishing you success in converting this True Lead™ to a lease!</span>
<br> <span style="font-weight:bold">The <a href="https://www.apartments.com/customers" style="color:#666;text-decoration:none" target="_blank" data-saferedirecturl="https://www.google.com/url?hl=en&amp;q=https://www.apartments.com/customers&amp;source=gmail&amp;ust=1603510777154000&amp;usg=AFQjCNHUYM0naErXYLjI9u_P_I4jk9Xtfg">Apartments.com Network</a> Team</span>
</td>

解决方法

我从您的问题中了解到，您想根据HTML中的某些关键字获取一些文本，这是一种实现方法！并且我已经编辑了答案，将内容存储在数组中，而不是即时记录

// the words you search for,note that in this solution they need to be ordered
// just to avoid nested for loops that leads to larger time complexity
let searchKeywords = ["Name","Phone","Email","Lead Submitted","Comments","Property Address 1"];
            
function getTextContent(keywords,htmlContent) {
  // an array to store in the content
  let arr = [];
  // since there is a <br> element before each span element that makes it
  // easy to just get the html and split it into lines
  htmlContent.split("<br>").forEach(function(e) {
    if(e.startsWith(` ${searchKeywords[arr.length]}`)) {
      // if the current line starts with the current keyword then if it has an
      // <a> tag then get the text of it,otherwise just slice the keyword name
      arr.push((e.includes("<a") ? e.substring(e.indexOf(">") + 1,e.indexOf("</a>")) : e.slice(e.indexOf(":") + 1)).trim());
    }
  });
  return arr;
}

let result = getTextContent(searchKeywords,document.querySelector("td").innerHTML);
console.log(result);

<table>
  <tr>
    <td align="left" style="font-family:'Lucida Grande','Lucida Sans Unicode','Lucida Sans','DejaVu Sans',Verdana,sans-serif;font-size:14px;color:#666;padding:24px">
      <span style="font-size:18px;font-weight:bold;color:#333">Renter's Information</span>
      <br> Name: Shelby 
      <br> Phone: <a href="tel:(555)%25555-5555" style="color:#666;text-decoration:none" target="_blank">(555) 555-555</a>
      <br> Email: <a href="mailto:email@gmail.com" style="color:#666;text-decoration:none" target="_blank">email@gmail.com</a>
      <br> Lead Submitted: 9/13/2020 1:42:37 PM
      <br>
      <br> <span style="font-size:18px;font-weight:bold;color:#333">Renter's Preferences</span>
      <br> Beds/Baths:
      <br> Model:
      <br> Unit:
      <br>
      <br> Move Date: 11/2/2020
      <br> Comments: Hi there! Just came across your listing online. I was wondering if you could send us some updated photos and financial information,as in if anything is included in cost,how much the house needs paid off &amp; just some details so we can look to see if we want to check it out. Thank you!
      <br>
      <br> <span style="font-size:18px;font-weight:bold;color:#333">Property Information</span>
      <br> Link: <a href="https://www.apartments.com/" style="color:#77b800;text-decoration:none" target="_blank" data-saferedirecturl="https://www.google.com/url?hl=">https://www.apartments.com/</a>
      <br> To: <a href="#m_7_" style="color:#666;text-decoration:none">property</a>
      <br> Property Address 1: <a href="#m_7654125587635847623_" style="color:#666;text-decoration:none">property</a>
      <br> Property Address 2: <a href="#m_7654125587635847623_" style="color:#666;text-decoration:none"></a>
      <br> City: city
      <br> State: NY
      <br> Zip: 12345
      <br>
      <br> <span style="font-weight:bold">Wishing you success in converting this True Lead™ to a lease!</span>
      <br> <span style="font-weight:bold">The <a href="https://www.apartments.com/customers" style="color:#666;text-decoration:none" target="_blank" data-saferedirecturl="https://www.google.com/url?hl=en&amp;q=https://www.apartments.com/customers&amp;source=gmail&amp;ust=1603510777154000&amp;usg=AFQjCNHUYM0naErXYLjI9u_P_I4jk9Xtfg">Apartments.com Network</a> Team</span>
    </td>
  </tr>
</table>

对于您的评论：

上面的HTML是HTML较大部分的一部分，因此要找到td，我必须搜索文本“ Renter's Information”，然后从那里可以实现您推荐的脚本

您可以过滤span元素以获得具有文本内容"Renter's Information"的元素然后获取其父元素，这就是您要寻找的td元素，这是代码

let tdElement = Array.prototype.filter.call(document.querySelectorAll("span"),function(e) {
  return e.textContent === "Renter's Information";
})[0].parentElement;

然后通过像这样调用getTextContent()来获取内容

let result = getTextContent(searchKeywords,tdElement.innerHTML);

使用jQuery在单个td中的文本节点选择器

如何解决使用jQuery在单个td中的文本节点选择器

解决方法

相关推荐