本系列文章已重新編修，並在加入部分 ES6 新篇章後集結成書，有興趣的朋友可至天瓏書局選購，感謝大家支持。

購書連結 https://www.tenlong.com.tw/products/9789864344130

讓我們再次重新認識 JavaScript！

重新認識 JavaScript 的三十篇文章雖然已經結束了，但因為三十天來已經寫習慣，沒寫點什麼覺得手癢，所以在鐵人賽結束之前，偶爾會出現番外篇 (意思就是不會每天寫) 來介紹一些實戰中的小技巧或是比較輕鬆一些的內容。 不過番外篇的篇幅不會太長就是了。

今天想要來介紹的是許多內容型網站都會用到的「複製網站文字再貼上時，會自動在剪貼簿上加上說明文字」的技巧。

在系列文 重新認識 JavaScript: Day 14 事件機制的原理 的時候我們曾經介紹過「事件」的觀念。

今天要介紹的是，當我們要複製網頁上文字的時候，觸發的就是 copy 事件。

所以簡單來說，如果我們今天不希望別人來複製我們網頁上的內容時，就可以透過 copy 事件加上 preventDefault 來做到這樣的效果：

document.addEventListener('copy', function(e) {
  e.preventDefault();
}, false);

因為事件的預設行為被擋下來了，所以就算按了複製，剪貼簿裡也什麼都沒有。
但這樣做顯然不太厚道。

所以我們可以改用加入「善意的提示文字」來做：

document.addEventListener('copy', function(e) {
  e.preventDefault();
  var msg = " 「抄襲者是烏龜王八蛋」";

  e.clipboardData.setData("text/plain", window.getSelection() + msg);
}, false);

像這樣在觸發 copy 事件時，透過 window.getSelection() 來取得我們選取的文字，然後透過 e.clipboardData.setData 來設定剪貼簿，並且加上我們想要附註在後面的文字就可以囉！

謎之聲：「這個提示文字哪裡有善意了」