Javascript XPath href console.log object Attr output

Question

Hey all I am looking to get the href link from some html using the Xpath like so:

function getStuff(Path) {
  var txt = '';
  var cnt = 0;
  var nodes = document.evaluate(Path, document, null, XPathResult.ANY_TYPE, null);
  var result = nodes.iterateNext();
  var Json = '{testing:[';
  while (result) {
    if (cnt != 10) {
      //console.log('Result: ', result);
      txt += '{href:' + result + '},';
      result = nodes.iterateNext();
      cnt++;
    } else {
      txt = txt.replace(/(^,)|(,$)/g, );
      break;
    }
  }
  return Json + txt + ']}';
}
console.log(getStuff("//html/body/div[1]/div/div/div/div/div/div/div/descendant::a[contains(@href, '?fref=pb')]/@href"));

The output looks like this:

{testing:[{href:[object Attr]},{href:[object Attr]},{href:[object A...etc etc

However, if I un-comment the console.log it outputs like I need it to:

Result:  href="/bob.barker.982?fref=pb"
Result:  href="/bill.gates.982?fref=pb"
Result:  href="/steve.jobs?fref=pb"
Result:  href="/513845713656?fref=pb"
Result:  href="/bill.murry?fref=pb"
Result:  href="/m.c.hammer?fref=pb"
...etc etc

How can I get that same output that console.log has but saved to the txt+= logic? And if there is a better way of doing this then please do share.

Here is the JSfiddle Demo

user_283366 · Answer

Each result is an Attr so you should use result.value

You can also simplify this using by building a real array and stringifying the result. Never build your own JSON strings

function getStuff(path) {
  const nodes = document.evaluate(path, document, null, XPathResult.ANY_TYPE, null);
  const result = {
    testing: []
  }
  
  let i = 0
  let attr = nodes.iterateNext()
  while (i++ < 10 && attr) {
    result.testing.push({ href: attr.value })
    attr = nodes.iterateNext()
  }

  // remove the last 2 args if you don't want formatting
  return JSON.stringify(result, null, 2) 
}
console.log(getStuff("//html/body/div[1]/div/div/div/div/div/div/div/descendant::a[contains(@href, '?fref=pb')]/@href"));

.as-console-wrapper { max-height: 100% !important; }

                 bob barker      something here
something here
something here
   someething here  something here 
         bill gates      something here
something here
something here
   someething here  something here 
         steve jobs      something here
something here
something here
   someething here  something here 
         513845713656      something here
something here
something here
   someething here  something here 
         bill murrey      something here
something here
something here
   someething here  something here 
         m.c.hammer      something here
something here
something here
   someething here  something here 
Open Dev Tools > console for output

user_16818745 · Answer

I see the problem. The developer console is logging Attribute objects. You need to find a way to turn the attribute into a string, like so:

txt += '{href:' + result.value + '},';

You might also want to do:

txt += '{href: \"' + result.value + '\"},';

Javascript XPath href console.log object Attr output

2 Answers