日本語が合ってるか分かりません。pixiv記法のままルビタグとして変換するスクリプトです。
pixivから個人サイトに動きたい人とか、pixivの記法の方がルビの対応が楽! みたいな人向けです。
あると便利かなーと思います。他の小説サイトのルビ記法はあったけれど、pixivは見つけられなかったので……。(前はどこかにあったよなと思って探したんですが。)
余談終わり。ここから本題。
jQueryのプラグインを利用しています。
https://nanos.jp/sikaku0/blog/2/15/
以下スクリプト(ofuseにペーストすると改行が消えるのでもうこのままで……。)
レンタルホームページに導入する場合には以下のコードを
<script>
//以下コード
(コピペのコード)
</script>
こんな感じで書いておいてください。
$(function(){ $('body').replaceText(/\[\[rb:(.*?)\s>\s(.*?)\]\]/gs,'<ruby>$1<rp>(</rp><rt>$2</rt><rp>)</rp></ruby>'); }); (function($) { $.fn.replaceText = function(pattern, replacement, nofollow) { var htmlEsc = str => str.replace(/[&<>'"`]/g, function(s) { return '&#' + s.charCodeAt(0) + ';'; }); var $not = this.find(nofollow || 'script,style').find('*').addBack(); this.find('*').addBack().not($not).contents().each(function() { if (this.nodeType != 3) return true; var str = htmlEsc($(this).text()); if (!str.match(pattern)) return true; $(this).replaceWith(str.replace(pattern, replacement)); }); return this; }; })(jQuery);
jQueryのプラグインを使用しているのでCDNを読み込んでください~~。
以下、コード
(function( $ ){
$.fn.replaceText = function(pattern,replacement,nofollow) {
var htmlEsc = str => str.replace(/[&<>'"`]/g,function(s){ return '&#'+s.charCodeAt(0)+';'});
var $not = this.find(nofollow||'script,style').find('').addBack();
this.find('').addBack().not($not).contents().each(function(){
if( this.nodeType != 3 ) return true;
var str = htmlEsc( $(this).text() );
if( !str.match(pattern) ) return true;
$(this).replaceWith( str.replace(pattern,replacement) );
});
return this;
};
$.fn.wrapText = function(pattern,tagname,nofollow) {
var pattern = pattern || /&#\d+;|\S/g;
var tagname = tagname || 'span';
var $adv = this.find(tagname);
return this.replaceText(pattern,'<'+tagname+'>$&</'+tagname+'>',nofollow).find(tagname).not($adv);
};
})( jQuery );
$(function(){
$('.comment').each(function() {
$(this)
.replaceText(/-rb([\s\S]*?)([\s\S]*?)-/g,'<ruby>$1<rp>(</rp><rt>$2</rt><rp>)</rp></ruby>')
.replaceText(/\[\[rb:([^\]]+?)>([^\]]+?)\]\]/g,'<ruby>$1<rt>$2</rt></ruby>')
.replaceText(/([\||])(.+?)《(.+?)》/g,'<ruby>$2<rt>$3</rt></ruby>')
.replaceText(/([\||])(.+?)((.+?))/g,'<ruby>$2<rt>$3</rt></ruby>')
.replaceText(/([\||])(.+?)\((.+?)\)/g,'<ruby>$2<rt>$3</rt></ruby>')
.replaceText(/([一-龠]+)《(.+?)》/g,'<ruby>$1<rt>$2</rt></ruby>')
.replaceText(/([一-龠]+)(([ぁ-んァ-ヶ]+?))/g,'<ruby>$1<rt>$2</rt></ruby>')
.replaceText(/([一-龠]+)\(([ぁ-んァ-ヶ]+?)\)/g,'<ruby>$1<rt>$2</rt></ruby>')
.replaceText(/([\||])《(.+?)》/g,'《$2》')
.replaceText(/([\||])((.+?))/g,'($2)')
.replaceText(/([\||])\((.+?)\)/g,'($2)');
});
});
おわり。
コメントするにはログインが必要です