Using ImportXML to pull HTML tags along with data

Question

Can ImportXML be used to pull the HTML tags along with the data?

For example:

importxml(A1,"//div[@id='qlist-wrapper']") on stackoverflow.com 

will pull all the data in the div with the id qlist-wrapper in an imploded format.

Is there a way where I can pull the data along with the relevant <div>s and <li>s and <ul>s ?

Strange request, I understand, but I have a need in one place and anyway of pulling the tags along with the data together will be really helpful.

Answer 1

SO it turns out you can do this after all!

=importxml("http://stackoverflow.com","//div[@id='qlist-wrapper']//@*")

Answer 2

No, =importXML does not offer this kind of XML formatting. But you can use a script to get parts of a page with HTML tags, like this:

function getHtml() {
  var text = UrlFetchApp.fetch("http://webapps.stackexchange.com").getContentText();
  var div = text.match(/<div id="qlist-wrapper">[\s\S]*(?=<div>\s*<a id="home-browse")/)[0];
  var qlist = XmlService.parse(div);
  var root = qlist.getRootElement();
  var list = root.getChild('div');
  var children = list.getChildren();
  var sheet = SpreadsheetApp.getActiveSheet();
  for (var i = 0; i < children.length; i++) {
    sheet.getRange(i+1, 1).setValue(XmlService.getPrettyFormat().format(children[i]));
  }
}

Explanation

The first line fetches the HTML source of the page. Sometimes one can parse it with XmlService.parse, but for complex pages with scripts, etc, this usually fails. For this reason, I use a regular expression to extract only a fragment, and then parse that. After parsing, one can do whatever XmlService offers: I just get a list of questions, and put them in separate cells in a readable XML format. One can, of course, drill deeper and extract particular XML elements from here.

An important caveat is that Google crawler is an anonymous visitor to the site: it gets served the page for anonymous users, which is not the same as you see.

<div class="question-summary narrow" id="question-summary-91365">
  <div onclick="window.location.href='/questions/91365/filtering-by-case-sensitive-string-equality'" class="cp">
    <div class="votes">
      <div class="mini-counts">
        <span title="2 votes">2</span>
      </div>
      <div>votes</div>
    </div>
    <div class="status answered-accepted" title="one of the answers was accepted as the correct answer">
      <div class="mini-counts">
        <span title="2 answers">2</span>
      </div>
      <div>answers</div>
    </div>
    <div class="views">
      <div class="mini-counts">
        <span title="41 views">41</span>
      </div>
      <div>views</div>
    </div>
  </div>
  <div class="summary">
    <h3>
      <a href="/questions/91365/filtering-by-case-sensitive-string-equality" class="question-hyperlink" title="I discovered (when answering this question) that string comparison in filter is case insensitive: the formulas =filter(A:A, B:B = &quot;Yes&quot;) and =filter(A:A, B:B = &quot;YES&quot;) have the same output.   ...">Filtering by case-sensitive string equality</a>
    </h3>
    <div class="tags t-google-spreadsheets">
      <a href="/questions/tagged/google-spreadsheets" class="post-tag" title="show questions tagged 'google-spreadsheets'" rel="tag">google-spreadsheets</a>
    </div>
    <div class="started">
      <a href="/questions/91365/filtering-by-case-sensitive-string-equality/?lastactivity" class="started-link">
        modified
        <span title="2016-03-30 19:42:07Z" class="relativetime">54 mins ago</span>
      </a>
      <a href="/users/79865/404">404</a>
      <span class="reputation-score" title="reputation score 11872" dir="ltr">11.9k</span>
    </div>
  </div>
</div>