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

Question

我需要提取姓名：，Phone：，电子邮件：，潜在客户提交：，评论：，属性地址 1：

之后的文本

问题是所有这些文本节点都是兄弟节点。如果它是文本节点，我不知道如何按数字选择兄弟姐妹 - 例如顶部的兄弟是一个跨度，但其余的是文本节点。我尝试了不同的迭代，但我唯一要做的就是 var comments = $('span:contains("Renter's Information")').siblings().text().trim(); 但这会拉取所有文本，而不仅仅是评论文本。理想情况下，我不仅希望获得每个文本节点，还希望获得 'Name:'、'Phone:' 等之后的文本，但我可能不得不 trim 关闭 post jQuery 虽然。任何有关提取这些单独文本节点的指导都将不胜感激。

<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>

Answer 1

我从你的问题中了解到你想根据 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>

以及您的评论：

The above HTML is part of a much larger section of HTML so to locate the td I'd have to search for the text "Renter's Information" and then from there I can implement the script you recommended

好吧，您可以过滤 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);

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

Text Node Selector within single td using jQuery

html

javascript

jquery

cheerio