Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts

    document.evaluate() on an HTML string

    Hi,
    I was wondering if it's possible to capture a piece of HTML using XPath where the source is a sting rather than a document.

    I know how to use xPath and document.evaluate() as I've used it before on actual web pages - I just dont understand how to run it on a string of HTML.

    E.g. if I have this string:
    var stg = "<div>The best-laid schemes o' <span>mice</span> an' men</div>";
    I'd like to convert this string into something that I can run the document.evaluate() on so that I can find the contents of the SPAN element (without loading the string into a real browser page).

    Thanks

  • #2
    Regular Coder
    Join Date
    Aug 2010
    Posts
    945
    Thanks
    19
    Thanked 205 Times in 203 Posts
    Code:
    <script type = "text/javascript">
    
    var stg = "<div>The best-laid schemes o' <span>mice</span> an' men</div>";
    if (window.DOMParser)
      {
      parser=new DOMParser();
      xml=parser.parseFromString(stg,"text/xml");}
    else // Internet Explorer
      {
      xml=new ActiveXObject("Microsoft.XMLDOM");
      xml.async="false";
      xml.loadXML(stg);  }
    
    path="/div/span";
    // code for IE
    if (window.ActiveXObject)
    {
    var nodes=xml.selectNodes(path);
    
    for (i=0;i<nodes.length;i++)
      {
      document.write(nodes[i].childNodes[0].nodeValue);
      document.write("<br />");
      }
    }
    // code for Mozilla, Firefox, Opera, etc.
    else if (document.implementation && document.implementation.createDocument)
    {
    var nodes=xml.evaluate(path, xml, null, XPathResult.ANY_TYPE,null);
    var result=nodes.iterateNext();
    
    while(result)
      {
      document.write(result.childNodes[0].nodeValue);
      document.write("<br />");
      result=nodes.iterateNext();
      }
    }
    
    
    </script>

  • Users who have thanked DaveyErwin for this post:

    spiderplant0 (10-08-2010)

  • #3
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks DaveyErwin. However I can only get it to work with valid XML/XHTML. If I use it on other HTML fragments (e.g. containing <br> rather than <br />) then it doesnt work. There doesnt seem to be a mime type for HTML for this function. (I'm using Firefox only).

    I managed to find a solution for CSS selectors but it seems strange there is not an equivalent for xPath. See below..
    Code:
        var stg = "<div>The best-laid<br> schemes o' <span>mice</span> an' men</div>";
        var newDiv = document.createElement("div");
        newDiv.innerHTML = stg;
    
        //this works
        console.log(newDiv.querySelectorAll("span")[0].textContent);
    
        //this doesnt work
        var recordNodes = newDiv.evaluate(
            ".//span",
            newDiv,
            null,
            XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
            null );
    
         console.log(recordNodes.snapshotLength);
    The mozilla function nsIScriptableUnescapeHTML.parseFragment() sounds like it might do the job but I cant get .evaluate() to work on it either (and the documentation is pretty slim).
    Last edited by spiderplant0; 10-08-2010 at 06:46 PM.

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,184
    Thanks
    10
    Thanked 569 Times in 550 Posts
    Code:
     var stg = "<div>The best-laid<br> schemes o' <br /><span>mice</span> an' men</div>";
        var newDiv = document.createElement("div");
        newDiv.innerHTML = stg;
    
          //this DOES work
        var recordNodes = document.evaluate(
            ".//span",
            newDiv,
            null,
            XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
            null );
    
         console.log(recordNodes.snapshotLength);
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/1/19) IE7:0.2, IE8:6.7, IE11:7.4, IE9:3.8, IE10:4.4, FF:18.3, CH:43.6, SF:7.8, MOBILE:27.5

  • Users who have thanked rnd me for this post:

    spiderplant0 (10-08-2010)


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •