上のページを参考にルビつきの文章を選択してボタンを押すとアラートでルビなしの選択テキストが表示されるスクリプトを書いたのでメモ。
——————————————-
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>a</title>
</head>
<body>
<section>
<h2>おはなし</h2>
<p>
<ruby><rb>親譲</rb><rp>（</rp><rt>おやゆず</rt><rp>）</rp></ruby>りの<ruby><rb>無鉄砲</rb><rp>（</rp><rt>むてっぽう</rt><rp>）</rp></ruby>で小供の時から損ばかりしている。
</p>
</section>
<div id=”foot_bt”>
ルビなし文章をアラート
</div>
</body>
</html>
——————————————-
//採用したのはこちら
——————————————-
//いったん削除する
var rtList = document.getElementsByTagName(“rt”);
var contentList = [];
Array.prototype.forEach.call(rtList, function(rt) {
contentList.push(rt.textContent); //配列に入れる
rt.textContent = “”; //空にする
});
//選択した文章を代入
selection_text = document.getSelection().toString();
//削除したやつを戻す
setTimeout(function() {
Array.prototype.forEach.call(rtList, function(rt) {
rt.textContent = contentList.shift();
});
}, 0);
——————————————-
最初の参考ページにdisplay:none;でルビを消す方法も載っているが、選択したテキストを取得する場合、IE11ではルビが残ってしまい無理だった。
参考：選択中文字列の取得 ブラウザによる違い
このページも役に立った
http://mamewaza.com/support/blog/howto-use-range-selection.html
