Created
April 16, 2024 03:06
-
-
Save mvark/778b0fa931636dfaea0b1134c152cf0e to your computer and use it in GitHub Desktop.
If you have products on a web page in a grid layout and you want it as a list, here's code that ChatGPT generated that you can use in the Developer Tools console for the required transformed output. Change the class or HTML attribute names as relevant to your case.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Find all div elements with class "gallery-item" | |
const products = document.querySelectorAll('div.gallery-item'); | |
// Array to store product list items | |
const productListItems = []; | |
// Iterate over each product | |
products.forEach(product => { | |
// Extract the hyperlink | |
const hyperlink = product.querySelector('a.block-wrapper-link').getAttribute('href'); | |
// Extract the name | |
const name = product.querySelector('h5').textContent.trim(); | |
// Extract the tagline | |
const tagline = product.querySelector('p.tagline').textContent.trim(); | |
// Construct the list item string and push to the array | |
const listItem = `<li><a href="${hyperlink}" target="_blank">${name}</a> - ${tagline}</li>`; | |
productListItems.push(listItem); | |
}); | |
// Convert the array to a single string with line breaks | |
const productListString = productListItems.join('\n'); | |
// Output the string | |
console.log(productListString); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment