TL;DR: If you want to copy a string representation of the specified object to the clipboard, you can use a Command-Line API function copy()
.
Exercise
Go to WeAreDevelopers World Congress Speakers website, open the developer tools and follow the code bellow
// NodeList of document's elements that match the selectors
const speakers = document.querySelectorAll(
".speakercolumn .title-heading-left"
);
// Create an Array from NodeList, because NodeList is not iterable with `map()`
const speakersArray = Array.from(speakers);
// Iterate through `speakersArray` to get `textContent` from every speaker (item of array)
const speakerTextContent = speakersArray.map((speaker) => speaker.textContent);
// copy the final result to clipboard
copy(speakerTextContent);
// The same function as above but without constants
copy(
Array.from(
document.querySelectorAll(".speakercolumn title-heading-left")
).map((speaker) => speaker.textContent)
);
That’s it. Pretty simple right? Thanks for the reading.
Top comments (2)
I see you just wrote this, but the above doesn't work -
While
.speakercolumn
is defined in an appended<style>
, it is otherwise not currently found in the document.I fear Chrome may have just killed off
copy()
Hello Rich, thanks for your comment! I really appreciate the feedback.
I have tried it on Chrome 80, Firefox Developer Edition 75 and Safari 13.1 and everything worked as expected. I can see the
speakercolumn
class in the DOM, so I wasn't successful with reproducing the problem, can you please try this snippet:and then log
speakers
With this snippet you will get more NodeLists than speakers (76) can you please confirm it?