I want to show my output of my js code in a html website

I want to show the output of this js code(main.js) in the body of this HTML code(index.html) how do I do it ? I want the output of the js code to be written int the body part of the HTML. If you have any ideas or tips please help ! and I am only a beginner so if you can please explain in simple and easy words thank you !!

main.js

const puppeteer = require('puppeteer')

async function scrapeProduct(url) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto(url);

  const [el] = await page.$x('//*[@id="root"]/div/div/div/div[3]/div[1]/div/div/div/div/div[2]/a/img');
  const src = await el.getProperty('src');
  const srcTxt = await src.jsonValue();

  const [el2] = await page.$x('//*[@id="root"]/div/div/div/div[3]/div[2]/div[1]/div/h1/span');
  const txt = await el2.getProperty('textContent');
  const title = await txt.jsonValue();
  
  const [el3] = await page.$x('//*[@id="a-autoid-25-announce"]/div/div/div[2]/div[1]/div[2]');
  const txt2 = await el3.getProperty('textContent');
  const price = await txt2.jsonValue();

  console.log({srcTxt, title, price});

  browser.close();
}

scrapeProduct('https://www.amazon.com/Apple-iPhone-Graphite-Carrier-Subscription/dp/B08L5PTDTK/ref=sxin_5_hcs-iphone-la-us-1_13578cf15aa1785726099782d173f9188ee25c1d?cv_ct_cx=iphone+11+pro&dchild=1&keywords=iphone+11+pro&pd_rd_i=B08L5PTDTK&pd_rd_r=f037e355-e446-4cf0-b1aa-52765c069e8d&pd_rd_w=fUKYi&pd_rd_wg=wPjUT&pf_rd_p=ca8576ce-79f8-455c-a665-74a3cdb09458&pf_rd_r=05N6D6JJWZMP9ZWVC8D5&qid=1602931849&sr=1-1-a6507b67-2964-41d0-ae7b-8e35005d291e');

the output :

{
 srcTxt: 'https://m.media-amazon.com/images/I/71YlH-4MUQL.jpg',
 title: 'New Apple iPhone 12 Pro (128GB, Graphite) [Locked] + Carrier Subscription',
 price: '+$55.00/mo'
}

the HTML :

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  // i want the output to be here
</body>
</html>


Read more here: https://stackoverflow.com/questions/64402662/i-want-to-show-my-output-of-my-js-code-in-a-html-website

Content Attribution

This content was originally published by skyy at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: