1

I am trying to get HTML tag value from JSON response using javascript.

JSON Response

{
  "@odata.count": 1,
  "value": [
    {
      "isDraft": false,
      "body": {
        "contentType": "html",
        "content": "<html><head>\r\n<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"><meta content=\"text/html; charset=utf-8\"></head><body style=\"font-family:Arial; font-size:10pt\"><p>The following services are available in Room 1</p><p style=\"font-family:SourceSansPro; font-size:18px; font-weight:bold; color:#272727; margin:20px 0px 0px 0px\">AV Services</p><table style=\"background-color:white; width:100%; max-width:210pt; border-spacing:0; border-collapse:collapse; font-size:10pt\"><tbody><tr><td style=\"font-family:SourceSansPro; font-size:14px; color:#576b76; width:85%; padding:10px 0px 0px 3px\">Test VC</td><td style=\"font-family:SourceSansPro; font-size:14px; font-weight:bold; color:#576b76; text-align:right; padding:10px 3px 0px 0px\">£0.00</td></tr></tbody></table><p style=\"font-family:SourceSansPro; font-size:18px; font-weight:bold; color:#272727; margin:20px 0px 0px 0px\">Supplies</p><table style=\"background-color:white; width:100%; max-width:210pt; border-spacing:0; border-collapse:collapse; font-size:10pt\"><tbody><tr><td style=\"font-family:SourceSansPro; font-size:14px; color:#576b76; width:85%; padding:10px 0px 0px 3px\">Test Sup</td><td style=\"font-family:SourceSansPro; font-size:14px; font-weight:bold; color:#576b76; text-align:right; padding:10px 3px 0px 0px\">£0.00</td></tr></tbody></table><p style=\"font-family:SourceSansPro; font-size:18px; font-weight:bold; color:#272727; margin:20px 0px 0px 0px\">Catering</p><table style=\"background-color:white; width:100%; max-width:210pt; border-spacing:0; border-collapse:collapse; font-size:10pt\"><tbody><tr><td style=\"font-family:SourceSansPro; font-size:14px; color:#576b76; width:85%; padding:10px 0px 0px 3px\">Test Cat</td><td style=\"font-family:SourceSansPro; font-size:14px; font-weight:bold; color:#576b76; text-align:right; padding:10px 3px 0px 0px\">£0.00</td></tr></tbody></table><br><br><br><table align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-collapse:separate; line-height:100%; width:200px\"><tbody><tr><td align=\"center\" bgcolor=\"#00b7f1\" valign=\"middle\" style=\"border:none; border-collapse:collapse; padding:12px 0\"><a href=\"https://abc.xyz.com/Core27/BookingForm/BookingForm.aspx?bookingID=Sk55%2bgbbD0B4uRwsW61yKw%3d%3d&amp;dplk=lCXPaOMB6CZQykhWofKF3Q==\" target=\"_blank\" style=\"background-color:#00b7f1; color:#ffffff; font-family:SourceSansPro; font-size:14px; font-weight:600; line-height:1.2; margin:0; text-decoration:none; text-transform:none\"><span style=\"font-weight:bold\">Add services to my booking​</span></a></td></tr></tbody></table></body></html>"
      }
    }
  ]
}

Postman Test Script

let response = pm.response.json(),
savedData = JSON.stringify(response.value[0].body.content);
pm.environment.set("DeepLink", savedData);
console.log(pm.variables.get("DeepLink"));

It gives me whole HTML body but how get the value of href tag only. i.e

https://abc.xyz.com/Core27/BookingForm/BookingForm.aspx?bookingID=Sk55%2bgbbD0B4uRwsW61yKw%3d%3d&amp;dplk=lCXPaOMB6CZQykhWofKF3Q==
rAJ
  • 1,295
  • 5
  • 31
  • 66

3 Answers3

1

Finally able to resolve this using cheerio

let response = pm.response.json(),
savedData = JSON.stringify(response.value[0].body.content);

var cheerio = require("cheerio");
var $ = cheerio.load(savedData);
link = $('td a').attr('href');

pm.environment.set("DeepLink", link);
console.log(pm.variables.get("DeepLink"));

Output

\"https://abc.xyz.com/Core27/BookingForm/BookingForm.aspx?bookingID=COPJYORMHgTbgrfMMn80YQ%3d%3d&dplk=lCXPaOMB6CZQykhWofKF3Q==&showServiceTab=1\"
rAJ
  • 1,295
  • 5
  • 31
  • 66
0

The following should do the trick:

const response={
  "@odata.count": 1,
  "value": [
    {
      "isDraft": false,
      "body": {
        "contentType": "html",
        "content": "<html><head>\r\n<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"><meta content=\"text/html; charset=utf-8\"></head><body style=\"font-family:Arial; font-size:10pt\"><p>The following services are available in Room 1</p><p style=\"font-family:SourceSansPro; font-size:18px; font-weight:bold; color:#272727; margin:20px 0px 0px 0px\">AV Services</p><table style=\"background-color:white; width:100%; max-width:210pt; border-spacing:0; border-collapse:collapse; font-size:10pt\"><tbody><tr><td style=\"font-family:SourceSansPro; font-size:14px; color:#576b76; width:85%; padding:10px 0px 0px 3px\">Test VC</td><td style=\"font-family:SourceSansPro; font-size:14px; font-weight:bold; color:#576b76; text-align:right; padding:10px 3px 0px 0px\">£0.00</td></tr></tbody></table><p style=\"font-family:SourceSansPro; font-size:18px; font-weight:bold; color:#272727; margin:20px 0px 0px 0px\">Supplies</p><table style=\"background-color:white; width:100%; max-width:210pt; border-spacing:0; border-collapse:collapse; font-size:10pt\"><tbody><tr><td style=\"font-family:SourceSansPro; font-size:14px; color:#576b76; width:85%; padding:10px 0px 0px 3px\">Test Sup</td><td style=\"font-family:SourceSansPro; font-size:14px; font-weight:bold; color:#576b76; text-align:right; padding:10px 3px 0px 0px\">£0.00</td></tr></tbody></table><p style=\"font-family:SourceSansPro; font-size:18px; font-weight:bold; color:#272727; margin:20px 0px 0px 0px\">Catering</p><table style=\"background-color:white; width:100%; max-width:210pt; border-spacing:0; border-collapse:collapse; font-size:10pt\"><tbody><tr><td style=\"font-family:SourceSansPro; font-size:14px; color:#576b76; width:85%; padding:10px 0px 0px 3px\">Test Cat</td><td style=\"font-family:SourceSansPro; font-size:14px; font-weight:bold; color:#576b76; text-align:right; padding:10px 3px 0px 0px\">£0.00</td></tr></tbody></table><br><br><br><table align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-collapse:separate; line-height:100%; width:200px\"><tbody><tr><td align=\"center\" bgcolor=\"#00b7f1\" valign=\"middle\" style=\"border:none; border-collapse:collapse; padding:12px 0\"><a href=\"https://abc.xyz.com/Core27/BookingForm/BookingForm.aspx?bookingID=Sk55%2bgbbD0B4uRwsW61yKw%3d%3d&amp;dplk=lCXPaOMB6CZQykhWofKF3Q==\" target=\"_blank\" style=\"background-color:#00b7f1; color:#ffffff; font-family:SourceSansPro; font-size:14px; font-weight:600; line-height:1.2; margin:0; text-decoration:none; text-transform:none\"><span style=\"font-weight:bold\">Add services to my booking​</span></a></td></tr></tbody></table></body></html>"
      }
    }
  ]
}, div=document.createElement("div");

div.innerHTML=response.value[0].body.content;
console.log(div.querySelector("a").href);

Strictly speaking a <div> cannot really contain an <html> element, but it seems to work nonetheless.

Carsten Massmann
  • 26,510
  • 2
  • 22
  • 43
  • ReferenceError: document is not defined – rAJ Oct 21 '20 at 09:27
  • Ahh, I was assuming you were applying JavaScript in a browser context. Is this a node.js app? If so, maybe the following might be helpful: https://stackoverflow.com/questions/51148846/alternative-of-document-object-in-node or, this: https://stackoverflow.com/a/55668667/2610061 – Carsten Massmann Oct 21 '20 at 09:38
-1

This is similar to Parse an HTML string with JS

Create a HTML element:

var el = document.createElement(savedData);

import the HTML:

el.innerHTML = savedData;

Get the a element:

let a = el.getElementsByTagName('a')

Then get the href from the a element:

let link = a[0].href;
Richard Priddy
  • 92
  • 6