デベロッパーツールのconsoleから<li>の中身の文字列を順番通りコピーしたい

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4  <meta charset="UTF-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6  <meta http-equiv="X-UA-Compatible" content="ie=edge">
7  <title>Document</title>
8</head>
9<body>
10  <ul id = "list1">
11    <li class="hoge">a</li>
12    <li class="hoge">b</li>
13    <li class="hoge">c</li>
14  </ul>
15  
16</body>
17</html>

webサイトにこんなリストがあるとします。
このリストの文字列だけ(a,b,c)を極力手作業を少なくExcelに縦に貼り付けたいです。
実行して直接クリップボードにコピーは難しそうなので
textareaを作ってそこに文字列+改行いれられないか1日あれこれやってみたんですがダメでした。
textareaをbodyのすぐ下に挿入するところはできたんですが、getElementsByClassNameでリストを取得してこれを文字列にするところで早くもつまづいてます。
できればクリップボードにコピーのほうもできそうならお願いします。

miyabi_pudding

2019/11/14 14:36 編集

自身で書いた、JavaScriptコードを記載してください。質問文は編集できます。また、要件確認ですが、クリップボードにコピーして、そのままエクセルにペーストした時、セルの各行に、 a b c と並ぶだけでいいんでしょうか？

行動規範の内容に同意します

回答3件

こういうことですか

javascript
1Array.from(document.querySelectorAll("li")).map(li=>li.innerText).join("\n")
2

投稿2019/11/14 14:41

matobaa

総合スコア2493

ベストアンサー

デベロッパーツールの Console で

copy($('#list1').innerText)

https://qiita.com/kyoshidajp/items/71054fb7851145eda91d
https://developer.mozilla.org/ja/docs/Web/API/Node/innerText

-- 11/20 13:25 コメント対応分追記

copy($$('#list1>.hoge').map(a => a.innerText).join('\r\n'))

https://developer.mozilla.org/ja/docs/Tools/Web_Console/Helpers

投稿2019/11/15 06:13

編集2019/11/20 04:27

x_x

総合スコア13749

nandemoggl

2019/11/15 14:03

ありがとうございます。会社の本番で試すのは来週になりそうですが、自分のPCのテストではうまくいってます。 <ul>の中にいくつか違うクラスをもった<li>があって.hogeだけ選別したい場合はどうすればいいですか？

行動規範の内容に同意します

javascript
1<script>
2window.addEventListener('DOMContentLoaded', ()=>{
3  const content=[].map.call(document.querySelectorAll('#list1 li'),x=>x.textContent).join("\n");
4  document.querySelector('#copy').addEventListener('click',()=>{
5    const ta = Object.assign(document.createElement('textarea'),{
6    textContent:content,
7    style:'positon:absolute;top:-999px',
8    });
9    document.querySelector('body').appendChild(ta);
10    ta.select();
11    document.execCommand('copy');
12    document.querySelector('body').removeChild(ta);
13  });                                                  
14});
15
16</script>
17<ul id = "list1">
18    <li class="hoge">a</li>
19    <li class="hoge">b</li>
20    <li class="hoge">c</li>
21</ul>
22<input type="button" id="copy" value="copy">