質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

4回答

4080閲覧

jsのリファクタリングをお願いしたいです!

MasakazuFukami

総合スコア1869

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

3クリップ

投稿2015/08/07 03:02

javascriptを書いたのですが綺麗にかけているのかどうかわからないのでコードの駄目だし、ここをこうしたほうがいいなどのアドバイス頂きたいです。

やりたいことは
・指定した画像(例の場合#js-translation-image)のview上でのサイズの変更を行いたい。
・拡大、縮小、初期化のボタンを用意
・拡大ボタンを押すと拡大率が0.5上がる(1.0 → 1.5)
・縮小ボタンを押すと拡大率が0.5下がる(1.0 → 0.5)
・初期化ボタンを押すと拡大率が1に戻る(2.5 → 1.0)
・ボタンを押した際の拡大率、縮小率は0.5倍刻み、最大3倍、最小0.5倍まで
・初期化のボタンを押すと拡大率を1に戻す。

以下がコードになります。

html

1 2<img src="text.jpg" height="100%" id="js-translation-image"> 3 4<div id="js-resizeImage"> 5 <div class="js-resizeImage--scaleUp"> 6 <i class="fa fa-plus fa-4x"></i> 7 <div class="p-hover-balloon">拡大</div> 8 </div> 9 <div class="js-resizeImage--scaleDown"> 10 <i class="fa fa-minus fa-4x"></i> 11 <div class="p-hover-balloon">縮小</div> 12 </div> 13 <div class="js-resizeImage--scaleInitial"> 14 <i class="fa fa-refresh fa-4x"></i> 15 <div class="p-hover-balloon">初期化</div> 16 </div> 17</div>

javascript

1//vendorprefixの判定 2var venderPrefix = (/webkit/i).test(navigator.appVersion) ? 'webkit' : 3 (/firefox/i).test(navigator.userAgent) ? 'moz' : 4 (/trident/i).test(navigator.userAgent) ? 'ms' : 5 'opera' in window ? 'O' : ''; 6 7//ページの画像のリサイズの挙動 8var resizeImage = function(element){ 9 var self = this; 10 self.elem = document.getElementById(element); 11 self.rate = 1.0; 12 13 self.scaleUp = function(){ 14 self.rate == 3 ? self.rate : self.rate += 0.5; 15 self.adoptScale(); 16 } 17 18 self.scaleDown = function(){ 19 self.rate == 0.5 ? self.rate : self.rate -= 0.5; 20 self.adoptScale(); 21 } 22 23 self.scaleInitial = function(){ 24 self.rate = 1.0; 25 self.adoptScale();; 26 } 27 28 self.adoptScale = function(){ 29 self.elem.style[venderPrefix + 'Transform'] = 'scale(' + self.rate + ')'; 30 } 31} 32 33var resizeImages = new resizeImage('js-translation-image'); 34 35//イベントを要素にセット 36$('#js-resizeImage').find('.js-resizeImage--scaleUp').on('click', function(){ 37 resizeImages.scaleUp(); 38}); 39 40$('#js-resizeImage').find('.js-resizeImage--scaleDown').on('click', function(){ 41 resizeImages.scaleDown(); 42}); 43 44$('#js-resizeImage').find('.js-resizeImage--scaleInitial').on('click', function(){ 45 resizeImages.scaleInitial(); 46});

ダメな部分はいっぱいあるかと思いますが、個人的には最後のイベントを3つの要素に設定している部分をもっとスマートに出来ないかなと思っています。

根本的におかしい部分などがありましたらご指摘していただけると嬉しいです。
よろしくお願いいたします!

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答4

0

すごくきれいに書けているとおもいます。
すぐに理解できました。

イベントの設定回りだけ書きました。

「私ならこう書く」という独善的な部分もありますので、あくまで参考まで。
(他の方の書き方も楽しみ)

私の書き方は、こう書いて動くようにオブジェクトを設計するというやり方なので、
呼び出された方のオブジェクトがめんどくさいことになることが多いです。


IDのprifix(js)が必要な理由が思いきませんでしたので削りました。

ボタンはresizeImageの下なで、resizeImageの装飾を削りました。resizeImageの指定を外すのもありですが、ボタンをdivでくくったのは、cssで配置などの調整をする以外にHTMLに意味を持たせてのことだとおもいますので・・・

セレクタはスペースを開けると子要素の選択ができます。リンク

関数の方は、要素・最大値・最小値は知らなくていいし、
ボタンの設定の近くに記述したほうがわかりやすくメンテしやすいです。
(オブジェクトで渡しでなくて通常の引数でもいいと思います。)

個人的な好みですが、サイズはパーセンテージ表記にました。

リサイズのステップは、呼び出すときに指定した方が読みやすい。
サイズ指定と、サイズ変更との2つの関数のほうが汎用性があると思います。

設定が1行に収まって読みやすくなったと思います。

javascript

1var img= new resizeImage('translation-image', {min:100, max:300}); 2$('#resizeImage .scaleUp').on('click', function(){img.resize(50);}); 3$('#resizeImage .scaleDown').on('click', function(){img.resize(-50);}); 4$('#resizeImage .scaleInitial').on('click', function(){img.setSize(100);});

人が書いたコードを好きかっていうのは気持ちがいいものなので、また出してください。(笑)
これが正解ということもないので、理由に合点がいくものだけ取り入れていけばいいと思います。

<追記>
他の人のコードに触発されたので、全体も書いてみました。
なんか頑張りすぎなコードですね。

html

1 <img src="text.jpg" height="100%" id="translation-image"> 2 <div id="resizeImage"> 3 <div class="scaleUp"> 4 <i class="fa fa-plus fa-4x"></i> 5 <div class="p-hover-balloon">拡大</div> 6 </div> 7 <div class="scaleDown"> 8 <i class="fa fa-minus fa-4x"></i> 9 <div class="p-hover-balloon">縮小</div> 10 </div> 11 <div class="scaleInitial"> 12 <i class="fa fa-refresh fa-4x"></i> 13 <div class="p-hover-balloon">初期化</div> 14 </div> 15 </div>

javascript

1//vendorprefixの判定 2var venderPrefix = (/webkit/i).test(navigator.appVersion) ? 'webkit' : 3 (/firefox/i).test(navigator.userAgent) ? 'moz' : 4 (/trident/i).test(navigator.userAgent) ? 'ms' : 5 'opera' in window ? 'O' : ''; 6 7$(document).ready(function(){ 8 //ページの画像のリサイズの挙動 9 var resizeImage = function(elem, option){ 10 var self = this; 11 var min = option.min || 0; 12 var max = option.max || 0; 13 var current = 100; 14 15 self.addRate = function(rate){ 16 self.setRate(current + rate); 17 } 18 19 self.setRate = function(rate){ 20 if (rate < min) rate= min; 21 if (0 < max && max < rate) rate = max; 22 current = rate; 23 elem.style[venderPrefix + 'Transform'] = 'scale(' + current / 100 + ')'; 24 } 25 } 26 27 var img = new resizeImage($('#translation-image')[0], {min:50, max:300}); 28 $('#resizeImage .scaleUp').on('click', function(){img.addRate(50);}); 29 $('#resizeImage .scaleDown').on('click', function(){img.addRate(-50);}); 30 $('#resizeImage .scaleInitial').on('click', function(){img.setRate(100);}); 31});

関数名はaddRateとsetRateとしました。

#resizeImageが何度も検索される点は、最初の1回だけなので、そんなに影響はないかなという考えでいます。

投稿2015/08/07 04:00

編集2015/08/10 15:35
iwamoto_takaaki

総合スコア2883

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

MasakazuFukami

2015/08/11 01:55

最初にご回答していただきありがとうございます!! %表示にして関数を1つにする方法は思いつきませんでした! ありがとうございます! あと熊本大学出身なので熊本の方と拝見して親近感が無駄に湧きました!(笑)
guest

0

とても読みやすく書かれているかと思います。
以下 少しだけ気になった点です。本当に重箱の隅をつつく程度の事ですが。

  1. 変数が全てグローバルに定義されてしまっています。意図して敢えてそうしているのなら良いのですがjQueryも使っているようですので$(function(){})で囲ってあげるなどして変数をグローバルに極力定義しないようにするのが望ましいかと思います。

  2. scaleUp()scaleDown()ですが、拡大縮小が最大値/最低値の時はadoptScale()を実行する必要はないのでif分に書き換えれば不要な処理を行わなくて住むようになると思います。

※ 厳密にはadoptScale()が呼び出された時に変更前のrateと変更後のrateが異なっている場合のみ実効するといった方法にすればscaleInitial()が呼び出された時に既にrate = 1.0なら実行しないといったふうにもできますが、強制的に初期化すると言う意味でこのままで良いかと思います。

  1. new演算子を使う関数名は大文字で始めたほうが良いかもしれません。

若干好みの問題ですが、ライブラリでもnewする関数は大文字始まりのものが多いように感じます。
これはnewを付け忘れて実行してしまいthiswindowになってしまいバグを発生させるのを避ける為の目印にしているのではないかと思っています。

  1. 何度も$('#js-resizeImage')を実行してjQueryの初期化をしていますので、コストがかかっています。(IDなのですごくコスト高というわけではありませんが) 変数に入れてキャッシュを取ってしまうかイベントの付け方を工夫してメソッドチェーンを使うのが良いかと思います。

個人的にjQueryオブジェクトを変数にする時は$始めの変数名にすると読みやすくなるかと思っています。
ex:

javascript

1var $jsResizeImage = $('#js-resizeImage');

<追記>
すみません。jsの変数名に'-'は使えませんでしたね。

以上を踏まえてたものが下記になります。ResizeImageの各関数の定義の方法はprototypeにつけちゃう方法もありますよ程度な感じなので参考程度に。

javascript

1$(function(){ 2 //vendorprefixの判定 3 var venderPrefix = (/webkit/i).test(navigator.appVersion) ? 'webkit' : 4 (/firefox/i).test(navigator.userAgent) ? 'moz' : 5 (/trident/i).test(navigator.userAgent) ? 'ms' : 6 'opera' in window ? 'O' : ''; 7 8 //ページの画像のリサイズの挙動 9 var ResizeImage = function(element) { 10 var self = this; 11 self.elem = document.getElementById(element); 12 // elementがクラス名とかに変更される可能性があるならjQueryを使った方がメンテコストを下げられるかと思います。その場合はnew ResizeImage('#'js-translation-image');のように呼び出し方を変更してください。 13 // self.elem = $(element).get(0); 14 self.rate = 1.0; 15 self.step = 0.5; 16 }; 17 18 ResizeImage.prototype.adoptScale = function(newRate) { 19 this.elem.style[venderPrefix + 'Transform'] = 'scale(' + newRate + ')'; 20 // this.rate を変更する処理を一元化しました 21 this.rate = newRate; 22 }; 23 24 ResizeImage.prototype.scaleInitial = function() { 25 this.adoptScale(1.0); 26 }; 27 28 ResizeImage.prototype.scaleUp = function() { 29 // rateが最大値以下なら拡大する 30 if(this.rate < 3) { 31 this.adoptScale( this.rate + this.step ); 32 } 33 }; 34 35 ResizeImage.prototype.scaleDown = function() { 36 // rateが最小値以下なら縮小する 37 if(this.rate > 0.5) { 38 this.adoptScale( this.rate - this.step ); 39 } 40 }; 41 42 43 var resizeImages = new ResizeImage('js-translation-image'); 44 45 //イベントを要素にセット 46 $('#js-resizeImage') 47 .on('click', '.js-resizeImage--scaleUp', function() { 48 resizeImages.scaleUp(); 49 }) 50 .on('click', '.js-resizeImage--scaleDown', function() { 51 resizeImages.scaleDown(); 52 }) 53 .on('click', '.js-resizeImage--scaleInitial', function() { 54 resizeImages.scaleInitial(); 55 }); 56});

画像変更部分と変更の呼び出し部分がバラバラなので、
画像変更するコントロール部分に対して、変更する画像をオプションで渡してしまうようなjQueryのプラグインのような形にしてしまうのも一つの方法かもしれません。


せっかくなのでやり過ぎた感に溢れるプラグイン化したものも書いてみます。

javascript

1$(function() { 2 //vendorprefixの判定 3 var venderPrefix = (/webkit/i).test(navigator.appVersion) ? 'webkit' : 4 (/firefox/i).test(navigator.userAgent) ? 'moz' : 5 (/trident/i).test(navigator.userAgent) ? 'ms' : 6 'opera' in window ? 'O' : ''; 7 8 var ResizeImageController = function(elm, options) { 9 var self = this, o; 10 self.$el = $(elm); 11 self.el = elm; 12 o = self.options = $.extend({}, ResizeImageController.DEFAULTS, options); 13 self.defaultRate = self.rate = o.rate; 14 self.step = o.step; 15 self.minScale = o.minScale; 16 self.maxScale = o.maxScale; 17 self.image = $( self.options.image ).get(0); 18 self.init(); 19 }; 20 21 // OPTIONS 22 ResizeImageController.DEFAULTS = { 23 rate: 1.0, 24 step: 0.5, 25 minScale: 0.5, 26 maxScale: 3.0, 27 image: 'img', 28 scaleUpBtn: '.scaleUp', 29 scaleDownBtn: '.scaleDown', 30 resetBtn: '.reset' 31 }; 32 33 ResizeImageController.prototype.venderPrefix = venderPrefix; 34 35 ResizeImageController.prototype.init = function() { 36 var self = this, o = self.options; 37 self.$el.on('click', o.scaleUpBtn, function() { 38 self.scaleUp(); 39 }) 40 .on('click', o.scaleDownBtn, function() { 41 self.scaleDown(); 42 }) 43 .on('click', o.resetBtn, function() { 44 self.scaleInitial(); 45 }); 46 }; 47 48 ResizeImageController.prototype.adoptScale = function(newRate) { 49 var self = this, o = self.options; 50 self.image.style[self.venderPrefix + 'Transform'] = 'scale(' + newRate + ')'; 51 self.rate = newRate; 52 }; 53 54 ResizeImageController.prototype.scaleInitial = function() { 55 this.adoptScale( this.defaultRate ); 56 }; 57 58 ResizeImageController.prototype.scaleUp = function() { 59 // rateが最大値以下なら拡大する 60 if(this.rate < 3) { 61 this.adoptScale( this.rate + this.step ); 62 } 63 }; 64 65 ResizeImageController.prototype.scaleDown = function() { 66 // rateが最小値以下なら縮小する 67 if(this.rate > 0.5) { 68 this.adoptScale( this.rate - this.step ); 69 } 70 }; 71 72 $.fn.resizeImageController = function(option) { 73 return this.each(function() { 74 var $this = $(this), 75 options = typeof(option) == 'object' && option; 76 $this.data('my.resizeImageController', new ResizeImageController(this, options)); 77 }); 78 }; 79 80 // Pluginを実行 81 $('#js-resizeImage').resizeImageController({ 82 image: '#js-translation-image', 83 scaleUpBtn: '.js-resizeImage--scaleUp', 84 scaleDownBtn: '.js-resizeImage--scaleDown', 85 resetBtn: '.js-resizeImage--scaleInitial' 86 }); 87 88});

最近jQueryのプラグイン作ってないので書き方がダメな部分もあるかもしれません。指摘して頂けますと幸いです。

投稿2015/08/09 18:29

編集2015/08/11 14:28
KiKiKi_KiKi

総合スコア596

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

MasakazuFukami

2015/08/11 01:50

ありがとうございます!! すごく勉強になりました! 僕の知識不足で申し訳ないのですが1つお聞きしたいことがあります。 ResizeImage.prototype.adoptScale = function(newRate) { this.elem.style[venderPrefix + 'Transform'] = 'scale(' + newRate + ')'; // this.rate を変更する処理を一元化しました this.rate = newRate; }; この部分なのですが、ResizeImage.prototype.adoptScaleと書かれているのですが、ResizeImage.adoptScaleではダメなのでしょうか?? レベルの低い質問で申し訳ございません! prototypeを使う場合と使わない場合の違いがいまいちわかっていないです。。。 もしよろしければご教授お願い致します!
KiKiKi_KiKi

2015/08/11 06:49 編集

`ResizeImage.adoptScale`とするのは下記と同じ扱いになります。 ``` var ResizeImage = function(element) { this.adoptScale = function() {...} } ``` prototype関連はちょっと油断するとすぐ忘れてしまうので中々説明が難しいのですが、 prototypeに着いてない変数や関数はnew ResizeImage()した時に作られるオブジェクトごとに作成されます。このケースでは何個もnew ResizeImage()でオブジェクトを作る事は無さそうなのでそんなに問題は無いかと思いますが、数が増えると同じ処理をする関数をもったオブジェクトがたくさんになるので領域の無駄遣いになってしまいます。 一方prototypeにくっついている関数は何度new ResizeImage()でオブジェクトを作っても各オブジェクトに関数が作られず、元のResizeImageにある関数を参照して各オブジェクトで使うようになる。といったイメージです。 説明が下手くそでスミマセン。下記のリンクなどが参考になるかと思います。 JavaScriptの「プロトタイプ入門」 http://qiita.com/takeharu/items/809114f943208aaf55b3 JavaScriptのオブジェクト指向:プロトタイプをきちんと理解する http://builder.japan.zdnet.com/script/sp_javascript-kickstart-2007/20369263/ コメント欄はマークダウン使えないのですねw
guest

0

綺麗だと思います。ですので個人的に気になる個所を書き換えたりしました。

25文字目のセミコロンが二つあったので削除しました。
また引数名がelementとなっていますがelementIdといった名前の方が適切だと考えます。
(jQueryを使用していることも考えて引数にセレクタを使えるように書き換え、
elem.style...としている点をjQueryで設定するよう書き換えるのもありかと思います)

各関数内の三項演算子は三項演算子でなくていいと思ったのでif文に置き換えました。
もし三項演算子を使用するなら私は次のように書くと思います。

今回全体を即時関数で囲いましたがグローバルにおいておく必要があるもの以外は、囲うことでグローバル変数を減らすようにすると良いと思います。

javascript

1self.scaleUp = function(){ 2 self.rate += self.rate == 3 ? 0 : 0.5; 3 self.adoptScale(); 4}

以下本文となるコードです。

javascript

1(function (document) { 2 //vendorprefixの判定 3 var venderPrefix = (/webkit/i).test(navigator.appVersion) ? 'webkit' : 4 (/firefox/i).test(navigator.userAgent) ? 'moz' : 5 (/trident/i).test(navigator.userAgent) ? 'ms' : 6 'opera' in window ? 'O' : ''; 7 8 //ページの画像のリサイズの挙動 9 var resizeImage = function (elementId) { 10 var self = this; 11 self.elem = document.getElementById(elementId); 12 self.rate = 1; 13 14 self.scaleUp = function () { 15 if (self.rate != 3) { 16 self.rate += 0.5; 17 } 18 self.adoptScale(); 19 } 20 21 self.scaleDown = function () { 22 if (self.rate != 0.5) { 23 self.rate -= 0.5; 24 } 25 self.adoptScale(); 26 } 27 28 self.scaleInitial = function () { 29 self.rate = 1; 30 self.adoptScale(); 31 } 32 33 self.adoptScale = function () { 34 self.elem.style[venderPrefix + 'Transform'] = 'scale(' + self.rate + ')'; 35 } 36 }; 37 38 var resizeImages = new resizeImage('#js-translation-image'); 39 var control_ui = $('#js-resizeImage'); 40 41 //イベントを要素にセット 42 control_ui.find('.js-resizeImage--scaleUp').on('click', function () { 43 resizeImages.scaleUp(); 44 }); 45 control_ui.find('.js-resizeImage--scaleDown').on('click', function () { 46 resizeImages.scaleDown(); 47 }); 48 control_ui.find('.js-resizeImage--scaleInitial').on('click', function () { 49 resizeImages.scaleInitial(); 50 }); 51}(document));

何か挙動に変化が起こるような記述のミスがあれば教えていただけると幸いです。

投稿2015/08/08 14:44

Cf_cwd

総合スコア730

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

MasakazuFukami

2015/08/11 01:53

回答有難うございます!! たしかに三項演算子である必要無いですね。。。 みなさんもおっしゃってるようにグローバル変数の問題も気をつけます! ご指摘ありがとうございます!!
Cf_cwd

2015/08/11 09:35

他の方の回答でもありますがメソッドに関してはprototypeに定義しておくといいですね。 prototypeチェーンを辿って実行できるので。
guest

0

元々ものすごく綺麗に書けていると思います。

もうあとは好みの問題だと思いますが、
最後のイベント設定の箇所、あえて言えば、

javascript

1var resizeImages = new resizeImage('js-translation-image'); 2 3//イベントを要素にセット 4var buttons = $('#js-resizeImage'); 5buttons.find('.js-resizeImage--scaleUp').on('click', resizeImages.scaleUp); 6buttons.find('.js-resizeImage--scaleDown').on('click', resizeImages.scaleDown); 7buttons.find('.js-resizeImage--scaleInitial').on('click', resizeImages.scaleInitial);
  1. 個人的に、('#js-resizeImage')と同じセレクタが三回出てくるのがなんか遅いような気がする(昔、IE6など遅いブラウザで動かしてた頃の名残)
  2. onの第二引数に、単に引数なしの関数を引き渡すだけであれば、無名関数でわざわざ囲わなくても直接渡せば良い

くらいでしょうか。

投稿2015/08/08 04:53

TetsuyaZama

総合スコア216

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

MasakazuFukami

2015/08/11 01:54

たしかに同じセレクタは良くないですね。。。 あと無名関数で囲わなくていい部分は気づきませんでした!! 次から気をつけます!! ありがとうございます!!!
KiKiKi_KiKi

2015/08/11 07:03

横からスミマセン。 buttons.find('.js-resizeImage--scaleUp').on('click', resizeImages.scaleUp); とした場合、このケースでは var self = this; を先にしていて各関数内で上位のスコープにあるselfを使用しているので問題が無いのですが、 各関数内での this がクリックされたボタンになってしまうので、thisを使っていた場合予期しないバグを発生させる可能性があるので少し注意が必要かもしれません。 ``` var resizeImage = function(element){ var self = this; <中略> self.scaleUp = function() { console.log(this); // thisが resizeImage ではなくなるので注意 self.rate == 3 ? self.rate : self.rate += 0.5; self.adoptScale(); }; <中略> }; ```
TetsuyaZama

2015/08/11 14:22

KiKiKi_KiKi様 >各関数内での this がクリックされたボタンになってしまうので、thisを使っていた場合予期しないバグを発生させる可能性があるので少し注意が必要かもしれません。 おっしゃる通りですね。。。 今回のケースでは問題ないかも知れませんが、少し不用意なリファクタリングを提案してしまったかも知れません。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問