ブックマークレット:Udemy講座の目次を作成する


Udemy講座の目次を作成する

やること

Udemy講座の目次をぱぱっと作成してしまおう

できること

Udemy講座の目次がクリップボードにコピーされます。

やりかた

ブックマークレットでサクッと

以下をブックマークレットとしてブラウザに登録してください。

javascript:document.querySelectorAll(".section--section--BukKG").forEach(el=>{  if(el.getAttribute("aria-expanded") == "false" ){    el.querySelector("[role=button]").click();  }}); function execCopy(string) {  var tmp = document.createElement("div");  var pre = document.createElement("pre");  pre.style.webkitUserSelect = "auto";  pre.style.userSelect = "auto";  tmp.appendChild(pre).textContent = string;  var s = tmp.style;  s.position = "fixed";  s.right = "200%";  document.body.appendChild(tmp);  document.getSelection().selectAllChildren(tmp);  var result = document.execCommand("copy");  document.body.removeChild(tmp);  return result;} var ary = [];document.querySelectorAll(".curriculum-item-link--title--zI5QT").forEach(el=>{ary.push(el.innerText.split("\n").join(""));});console.log(ary.join("\r\n"));execCopy(ary.join("\r\n"));

使い方

Udemyの講座ページを開いて実行します。

あとは、エディタに貼り付けて加工!

以上!

解説

整形

// javascript: 
// ★(1)ここで右側のプルダウンをすべて展開します!
document.querySelectorAll(".section--section--BukKG").forEach(el => {
  if (el.getAttribute("aria-expanded") == "false") {
    el.querySelector("[role=button]").click();
  }
});

// ★(2)クリップボードにコピーするための関数を定義します!
function execCopy(string) {
  var tmp = document.createElement("div");
  var pre = document.createElement("pre");
  pre.style.webkitUserSelect = "auto";
  pre.style.userSelect = "auto";
  tmp.appendChild(pre).textContent = string;
  var s = tmp.style;
  s.position = "fixed";
  s.right = "200%";
  document.body.appendChild(tmp);
  document.getSelection().selectAllChildren(tmp);
  var result = document.execCommand("copy");
  document.body.removeChild(tmp);
  return result;
}
// ★(3)要素を取得して配列に詰め込みます!
var ary = [];
document.querySelectorAll(".curriculum-item-link--title--zI5QT").forEach(el => {
  ary.push(el.innerText.split("\n").join(""));
});
console.log(ary.join("\r\n"));
// ★(4)配列をくっつけて、クリップボードにコピーします!
execCopy(ary.join("\r\n"));

あとがき

取得対象の要素名(クラス名など)が変わると動かなくなります。
2020/07/05現在動いているので目次を取りたい際は試してみて下さい。