JavaScriptに関する質問・疑問一覧 - (81件目〜100件目)

JS テーブルのアニメーション表示

JavaScript テーブルのアニメーション表示ここに１つのテーブルがあります。「すべて表示」にチェックを入れたら、すべての列を表示します。「３大栄養素」にチェックを入れたら、３大栄養素の列だけ表示します。次の仕様を満たすには、どのようなコードになりますか？＜仕様＞・「３大栄養素」は表の項目セルに「S３」クラスを付与・チェックボックスで列の表示制御をする・表示・非表示はスライド・アニメーション［HTML］ <div class="container"> <form name="form2"> <label><input name="check2" type="checkbox">３大栄養素</label> </form> <table id="tbl3"> <caption>イチジクの栄養価</caption> <thead> <tr> <th>状態</th> <th>エネルギー</th> <th>水分</th> <th class="S3">たんぱく質</th> <th class="S3">脂質</th> <th class="S3">炭水化物</th> <th>灰分</th> <th>飽和脂肪酸</th> <th>不飽和脂肪酸</th> <th>コレステロール</th> <th>食物繊維</th> </tr> </thead> <tbody> <tr> <th>生</th><td>54 kcal</td><td>84.6g</td><td>0.6g</td> <td>0.1g</td><td>14.3g</td><td>0.4g</td><td>0.02g</td> <td>0.07g</td><td>0</td><td>1.9g</td> </tr> </tr> <th>乾</th><td>291 kcal</td><td>18.0g</td><td>3.0g</td> <td>1.1g</td><td>75.3g</td><td>2.5g</td><td>0.17g</td> <td>0.60g</td><td>0</td><td>10.7g</td> </tr> </tbody> </table> </div>

締切済み
retorofan
JavaScript
回答数4
2023/06/23 09:50

Jxaのフォルダー参照ダイアログを表示

初心者です。 macでスクリプトエディタをつかってフォルダー参照のダイアログを表示させたいのですが下記コードを実行するとエラーがでてしまいます。解決策はありますでしょうか？コード ----------------------------------------------------------------------------- var destFolder = null; destFolder = Folder.selectDialog( 'PDF ファイルの保存先フォルダーを選択してください。', '~' ); ------------------------------------------------------------------------------ エラー内容 Error: ReferenceError: Can't find variable: Folder 言語:JavaSclipt

ベストアンサー
gen531278
JavaScript
回答数1
2023/06/22 17:46

入力フォームのテキストのエラーメッセージについて

javascript　２つのセレクトボックスを全て選択されていないと、「テキストによるエラーメッセージを表示させるコード」を調べています。該当コードは<script>■■四角の記号の部分です。セレクトボックスを２つとも未選択でsubmitを押すと、アラートのメッセージとテキストエラーによるメッセージ２つが同時に表示されるようになっています。コードはきちんと起動します。該当部分のdocument.querySelector('.err')?.remove();の意味が理解できずにいます。 insertAdjacentHTMLで出したテキストエラーをセレクトボックスが空欄でない時に非表示にするとい解釈のようですが、あってますでしょうか？ class名やid名に('.err')?という名前は使用していませんがドットに.errとクエスチョンマーク？とはどういう意味なのでしょうか？条件演算子の？でしょうか条件演算子の構文で変数 = 条件 ? 値１ : 値２;の構文とも違うようですし。分からずにいます。回答よろしくお願いいたします。 ---HTMLのコード--- <body> <form action="form1.php" method="post" id="form"> 選択項目①： <select id="fruits" class="select1" name="fruits"> <option value="">果物を選択する</option> <option value="リンゴ">>リンゴ</option> </select> 選択項目②： <select id="fruits2" class="select1" name="fruits2"> <option value="">食事を選択する</option> <option value="ごはん">>ごはん</option> </select> <div class="alert15"></div> <button id="submit" class="yohaku"> </button> </form> ---javascriptののコード--- <script> const form = document.querySelector('#form'); const fruits = document.querySelector('#fruits'); const fruits2 = document.querySelector('#fruits2'); // セレクトボックスを選択されてないとアラートによるエラーメッセージを表示 form.addEventListener('submit', function(event) { let msg = ""; if (fruits.value == "") msg += "選択項目①：※選択項目①を選択して下い。\n"; if (fruits2.value == "") msg += "選択項目②：※選択項目②を選択してください。\n"; if (msg != "") { event.preventDefault(); alert(msg); } }); </script> ■■ <script> // ２つとも全て選択されてないとテキストによるエラーメッセージの表示 form.addEventListener('submit', e=>{ document.querySelector('.err')?.remove(); document.querySelector('.alert15').insertAdjacentHTML('afterend',`<span class="err">※選択項目①と選択項目②を全て選択して下さい。</span>`); },true); </script> </body>

ベストアンサー
hayosat
JavaScript
回答数3
2023/06/22 15:44

JS テーブルのデータ検索

JavaScriptのテーブルでデータ検索をします。ヒットしたセルの背景は色付けします。正規表現を用いて検索するにはどのようなコードになりますか？ ※ 正規表現を用いればセルごとの照合作業は不要です。　つまり、ループ処理は無用です。 [HTML] <form name="form3"> <input name="btn" type="button" value="整数"> <input name="btn" type="button" value="小数"> <input name="btn" type="button" value="半角英字"> <input name="btn" type="button" value="日本語"> <input name="reset" type="button" value="リセット"> </form> <table id="table3" border="1"> <thead> <tr> <th></th> <th>A</th><th>B</th><th>C</th><th>D</th><th>E</th> <th>F</th><th>G</th><th>H</th><th>I</th><th>J</th> </tr> </thead> <tbody> <tr> <th>1</th> <td>風</td><td>25</td><td>fig</td><td>36</td><td>84</td> <td>45</td><td>dog</td><td>鳥</td><td>7.9</td><td>昼</td> </tr> <tr> <th>2</th> <td>16</td><td>ink</td><td>4.3</td><td>1.4</td><td>64</td> <td>6.2</td><td>gal</td><td>7.2</td><td>6.5</td><td>hit</td> </tr> <tr> <th>3</th> <td>arm</td><td>83</td><td>1.8</td><td>6.1</td><td>冬</td> <td>6.4</td><td>8.4</td><td>地</td><td>joy</td><td>cat</td> </tr> <tr> <th>4</th> <td>22</td><td>egg</td><td>春</td><td>番</td><td>3.5</td> <td>天</td><td>人</td><td>7.8</td><td>朝</td><td>2.8</td> </tr> <tr> <th>5</th> <td>月</td><td>愛</td><td>5.1</td><td>花</td><td>bat</td> <td>51</td><td>7.5</td><td>夏</td><td>18</td><td>秋</td> </tr> </tbody> </table>

締切済み
retorofan
JavaScript
回答数1
2023/06/20 22:13

sessionStorageについて調べています。

入力フォーム、名前の入力欄とセレクトボックス２つを書いています。入力フォームで選択セレクトボックスの内容をsubmitを押して、次ページ「確認画面」に行ったときに、その確認画面から前面遷移した時に、選択したセレクトボックスの値が保持されるようにコードを書いているのですが、セレクトボックスのsessionStorageのコード●黒丸の部分にありますコードは、なぜ、名前nameの入力フォームのsessionStorageの書き方と違うのでしょうか？保存したセッションストレージを変数にするまでは、入力フォームとセレクトボックスも同じですが、入力フォームの条件文とセレクトボックスの条件文が異なる書き方をしている理由は分かりますでしょうか？？？入力フォームの条件式 if (name.value != "") sessionStorage.setItem('name', name.value); セレクトボックスの条件式 if(val1!== null)fruits.value = val1; ※PHPを使った方がよいですが、今は練習なので、使っていません。提示コードの意味は大まかにわかっています。自分で書いたコードではありません。 ---HTMLのコード--- <body> <form action="form1.php" method="post" id="form"> 名前：<input type="text" class="form1" name="name" id="name" value="" /> 選択①: <select id="fruits" class="select1" name="fruits"> <option value="">果物を選択する</option> <option value="">リンゴ</option> </select> 選択②： <select id="food" class="select1" name="food"> <option value="">食品を選択する</option> <option value="">ごはん</option> </select> <button id="submit" class="yohaku"> </button> </form> </body> ---javascriptのコード--- <script> const key = 'date_key'; const form = document.querySelector('#form'); const name = document.querySelector('#name'); form.addEventListener('change', function() { if (name.value != "") sessionStorage.setItem('name', name.value); if (fruits.value != "") sessionStorage.setItem('fruits', fruits.value); if (food.value != "") sessionStorage.setItem('food', food.value); }); ● let val1 = sessionStorage.getItem('fruits'); if(val1!== null)fruits.value = val1; ● let val2 = sessionStorage.getItem('food'); if(val2!== null)food.value = val2; name.value = sessionStorage.getItem('name'); </script>

ベストアンサー
hayosat
JavaScript
回答数1
2023/06/20 15:56

JavaScript パターン作成

JavaScriptで添付画像のようなパターンを作ります。ループ処理(for, forEach, e.t.c.)を用いずに作るにはどのようなコードになりますか？ <table id="table2"> <tbody> <tr> <th></th><th>A</th> <th>B</th><th>C</th><th>D</th><th>E</th><th>F</th> <th>G</th><th>H</th><th>I</th><th>J</th><th>K</th> </tr> <tr> <th>1</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>2</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>3</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>4</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>5</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>6</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>7</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>8</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>9</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>10</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> <tr> <th>11</th><td></td> <td></td><td></td><td></td><td></td><td></td> <td></td><td></td><td></td><td></td><td></td> </tr> </tbody> </table>

ベストアンサー
retorofan
JavaScript
回答数4
2023/06/19 23:10

プロセッシングのmap関数

プロセッシングで、float x =map(a,b,c,d,e)の使い方が分からないので教えてください。

締切済み
KTOU20230328
JavaScript
回答数1
2023/06/15 21:26

jsの変換プログラムで、泉ケ丘のケをgaに変換

https://hebonshiki-henkan.info/ 上のhpをもとにして作っています。例えば、ひらがなのあや、カタカナのアは、aと認識します。以下のjs文のままだと、新たに、深井→FUKAIと設定した場合はプログラムは正常に動くのですが、泉ケ丘と、カタカナのケを使った場合、単体のケと認識されて、 keと入力されてしまいます。これをgaと認識させるには、どのようなプログラムにすればいいのでしょうか。以下はjs文です。 function ToHebon(){var map={"あ":"a","い":"i","う":"u","え":"e","お":"o", "か":"ka","き":"ki","く":"ku","け":"ke","こ":"ko", "さ":"sa","し":"shi","す":"su","せ":"se","そ":"so", "深井":"FUKAI", "泉ケ丘":"IZUMIGAOKA", "ー":"" }; var temp_data="";var temp_data2="";var temp_data3="";var temp_data4="";var temp_data5="";var temp_data6=""; var temp_data7="";var temp_data8="";var temp_data9="";var temp_data10="";var roma_data=""; var result_data="";source_data=document.form1.input_text.value; for(i=0;i<source_data.length;i=i+1) {temp_data=source_data.substring(i,i+1); temp_data2=source_data.substring(i,i+2); if(map[temp_data2]===undefined){ if(map[temp_data]===undefined) {roma_data=roma_data+temp_data} else{roma_data=roma_data+map[temp_data]}} else{i=i+1;roma_data=roma_data+map[temp_data2]}} for(i=0;i<roma_data.length;i=i+1){ temp_data=roma_data.substring(i,i+1); temp_data2=roma_data.substring(i,i+2); temp_data3=roma_data.substring(i,i+3); temp_data4=roma_data.substring(i,i+4); temp_data5=roma_data.substring(i,i+5); temp_data6=roma_data.substring(i,i+6); temp_data6=roma_data.substring(i,i+7); temp_data6=roma_data.substring(i,i+8); temp_data6=roma_data.substring(i,i+9); temp_data6=roma_data.substring(i,i+10); sub_str2=temp_data2.substring(1,2); if(temp_data4=="noue"){i=i+3;temp_data="noue"} else if(temp_data6=="touchi"){i=i+5;temp_data="touchi"} else{if(temp_data2=="uu"||temp_data2=="ee"||temp_data2=="ou"||temp_data2=="oo"){i=i+1} else if(temp_data2=="nb"||temp_data2=="nm"||temp_data2=="np"){temp_data="m"} else if(temp_data=="っ"||temp_data=="ッ"){if(temp_data3=="っch"||temp_data3=="ッch"){temp_data="t"} else if(sub_str2.match(/[a-z]/gi)){temp_data=sub_str2}else{temp_data="tsu"}}}result_data=result_data+temp_data} if(document.form1.uplow[0].checke

ベストアンサー
sembokulove
JavaScript
回答数1
2023/06/13 13:51

JS テーブルデータ：シャッフル関数の修正

JavaScript テーブルデータ：シャッフル関数の不具合を修正するには？ここに１つのテーブルがあります。 tbody td のセルデータをシャッフルする関数を作ってみました。どこをどのように修正したらよいのでしょうか？今のところ、下記の不具合があります。 ■ 行のシャッフルは出来るが、列のシャッフルがされていない　（すべてのＴＤ内のシャッフルをしたい）＜仕様＞・ボタンを押すごとにテーブル内を並べ替える・thの内容は固定・並べ替えるのは tbody tdの内容 [HTML] <button id="button2">シャッフル</button> <table id="table5" border="1"> <thead> <tr> <th></th> <th>A</th> <th>B</th> <th>C</th> <th>D</th> <th>E</th> <th>F</th> <th>G</th> <th>H</th> <th>I</th> <th>J</th> </tr> </thead> <tbody> <tr> <th>1</th> <td>春</td> <td>夏</td> <td>秋</td> <td>冬</td> <td>朝</td> <td>昼</td> <td>番</td> <td>花</td> <td>鳥</td> <td>風</td> </tr> <tr> <th>2</th> <td>月</td> <td>天</td> <td>地</td> <td>人</td> <td>愛</td> <td>4.3</td> <td>3.5</td> <td>8.4</td> <td>6.1</td> <td>6.4</td> </tr> <tr> <th>3</th> <td>1.8</td> <td>7.8</td> <td>1.4</td> <td>7.5</td> <td>6.2</td> <td>6.5</td> <td>5.1</td> <td>7.9</td> <td>7.2</td> <td>2.8</td> </tr> <tr> <th>4</th> <td>83</td> <td>64</td> <td>18</td> <td>51</td> <td>36</td> <td>45</td> <td>84</td> <td>22</td> <td>16</td> <td>25</td> </tr> <tr> <th>5</th> <td>arm</td> <td>bat</td> <td>cat</td> <td>dog</td> <td>egg</td> <td>fig</td> <td>gal</td> <td>hit</td> <td>ink</td> <td>joy</td> </tr> </tbody> </table> <script> //試作中 document.getElementById("button2").onclick = function (){ Array.prototype.shuffle = function(){ var t=this,a=t.length,b=[],c=a,i,r; for(i=0;i<a;i++)b[i]=t[i]; for(i=0;i<a-1;i++){ r=Math.floor(Math.random()*c); t[i]=b[r];b[r]=b[c-1];c--; } t[a-1] = b[0]; return t; }; var subject = document.querySelector("#table5 tbody"); var rowData = []; var rows = subject.getElementsByTagName("TR"); var cells; var i, j; for (i=0; i<rows.length; i++) { rowData[i] = []; cells = rows[i].getElementsByTagName("TD"); for (j=0; j<cells.length; j++) { rowData[i][j] = cells[j].innerHTML; } } rowData.shuffle(); for (i=0; i<rowData.length; i++) { cells=rows[i].getElementsByTagName("TD"); for (j=0; j<cells.length; j++) { cells[j].innerHTML = rowData[i][j]; } } } </script>

ベストアンサー
retorofan
JavaScript
回答数6
2023/06/13 05:59

loadの VanillaJS版は作れますか？

jQuery load()メソッドの VanillaJS版は作れますか？ jQuery load()メソッドはサーバー上で用います。この代替関数は作れますか？＜仕様＞・jQuery等のプラグインは不要・ローカル環境でも稼働・外部HTMLファイルの一部のみ表示する [メインHTMLファイル] load_parent.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>sample</title> <style> #result { color: red; } </style> </head> <body> <h1>外部ファイルの一部表示</h1> <pre> jQuery load()メソッドの脱jQuery版テストです. ＜仕様＞・サーバー上だけでなく、ローカル環境でも稼働する。・リストの「３行目」だけを表示させる。 // jQuery version // $("#result").load("./load_child.html .row:nth-child(3)"); </pre> <hr> <div id="result">読み込み場所</div> </body> </html> [読込HTMLファイル] load_child.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>sample</title> </head> <body> <h1>読み込みファイル</h1> <pre> シンプルなHTMLファイルです. </pre> <ol> <li class="row">１行目</li> <li class="row">２行目</li> <li class="row">３行目</li> <li class="row">４行目</li> <li class="row">５行目</li> </ol> </body> </html> メインHTMLファイル内にJavaScriptでコーディングして読み込み場所が「３行目」と書き換えられたら代替関数になり得ます。

締切済み
retorofan
JavaScript
回答数2
2023/06/09 21:06

safariでイベントが発火しない

この状態でr.src = ""が効かない原因を知りたいです。 var se = d.createElement("audio"); var r = document.createElement("input"); r.type = "file"; var blobel = new Array(25); dc("info")[0].appendChild(r); var idd = 0; function ppd(){ blobel[idd] = r.files[0]; r.src = ""; idd++; if (idd == 11){ clearEventListener("change", ppd()); r.style.display = "none"; } if (idd == 1){ se.src = blobel[0]; } } r.addEventListener("change", ppd()); 要はinput fileを初期化したいがイベントが発火しないという困り事です。ご意見、よろしくお願いします。

ベストアンサー
inclode
JavaScript
回答数2
2023/06/05 12:08

jQuery 円周上に配置した要素を加工したい

jQuery 円周上に配置した要素を加工したいここに円周上に等間隔に要素を配置するコードがあります。これを下記の要件を満たすためには、どんなコードにしたらよいですか？＜要件＞・基準点を赤丸で表示させる・時計の文字盤のような数字の配置にする（真上がゼロ）・円内の文字が上下左右とも、中央に来るようにする・数字は赤丸を天にした向きに表示させる <script src='https://code.jquery.com/jquery-3.7.0.min.js'></script> <style> .main-board { position: relative; width: 300px; } .circle-box { } div.item { position: absolute; width: 40px; height: 40px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background-color: #0dd; } </style> <section class="main-board"> <section class="circle-box"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> </section> </section> <script> $(function(){ var item_num = $('div.item').length; var deg = 360.0 / item_num; var red = (deg * Math.PI / 180.0); var circle_r = $("div.item").width() * 2.5; $('div.item').each(function(i, elem) { var x = Math.cos(red * i) * circle_r + circle_r; var y = Math.sin(red * i) * circle_r + circle_r; $(elem).css('left', x); $(elem).css('top', y); $(elem).text(i); }); }); </script>

締切済み
retorofan
JavaScript
回答数2
2023/06/02 12:41

JS テーブルのデータをシャッフルするには？

JavaScript テーブルのデータをシャッフルするには？ここに１つのテーブルがあります。 tbody td のセルデータをシャッフルするにはどんなコードでできますか？要は、テーブル内容をランダムに並べ替える、ということです。＜仕様＞・ボタンを押すごとにテーブル内を並べ替える・thの内容は固定・並べ替えるのは tbody tdの内容 [HTML] <button id="button1">シャッフル</button> <table id="table5" border="1"> <thead> <tr> <th></th> <th>A</th> <th>B</th> <th>C</th> <th>D</th> <th>E</th> <th>F</th> <th>G</th> <th>H</th> <th>I</th> <th>J</th> </tr> </thead> <tbody> <tr> <th>1</th> <td>春</td> <td>夏</td> <td>秋</td> <td>冬</td> <td>朝</td> <td>昼</td> <td>番</td> <td>花</td> <td>鳥</td> <td>風</td> </tr> <tr> <th>2</th> <td>月</td> <td>天</td> <td>地</td> <td>人</td> <td>愛</td> <td>4.3</td> <td>3.5</td> <td>8.4</td> <td>6.1</td> <td>6.4</td> </tr> <tr> <th>3</th> <td>1.8</td> <td>7.8</td> <td>1.4</td> <td>7.5</td> <td>6.2</td> <td>6.5</td> <td>5.1</td> <td>7.9</td> <td>7.2</td> <td>2.8</td> </tr> <tr> <th>4</th> <td>83</td> <td>64</td> <td>18</td> <td>51</td> <td>36</td> <td>45</td> <td>84</td> <td>22</td> <td>16</td> <td>25</td> </tr> <tr> <th>5</th> <td>arm</td> <td>bat</td> <td>cat</td> <td>dog</td> <td>egg</td> <td>fig</td> <td>gal</td> <td>hit</td> <td>ink</td> <td>joy</td> </tr> </tbody> </table>

締切済み
retorofan
JavaScript
回答数3
2023/05/31 11:16

JS 簡単なコードで表を転置できますか？

JavaScript 簡単なコードで表を転置できますか？ここに１つのテーブルがあります。これを簡単なコードで転置できますか？ここにいう転置とは、表のセルについて、(m×n行列) => (n×m行列) に変換することです。＜仕様＞・テーブルの列と行を入れ替える・文字は横書きのままで変更なし・Vanilla JS で ( jQuery 無用 ) ・チェックボックスでトグル <div><input type="checkbox" id="menu">転置</div> <div class="container"> <table id="table2" border="1"> <caption>世界の高い山トップ10</caption> <thead> <tr><th>順位</th><th>山の名称</th><th>標高 (ｍ)</th></tr> </thead> <tbody> <tr><td> 1位</td><td>エベレスト</td><td>8,848</td></tr> <tr><td> 2位</td><td>Ｋ２</td><td>8,611</td></tr> <tr><td> 3位</td><td>カンチェンジュンガ</td><td>8,586</td></tr> <tr><td> 4位</td><td>ローツェ</td><td>8,516</td></tr> <tr><td> 5位</td><td>マカルー</td><td>8,485</td></tr> <tr><td> 6位</td><td>チョ・オユー</td><td>8,201</td></tr> <tr><td> 7位</td><td>ダウラギリ</td><td>8,167</td></tr> <tr><td> 8位</td><td>マナスル</td><td>8,163</td></tr> <tr><td> 9位</td><td>ナンガ・パルバット</td><td>8,126</td></tr> <tr><td>10位</td><td>アンナプルナ</td><td>8,091</td></tr> </tbody> </table> </div>

ベストアンサー
retorofan
JavaScript
回答数1
2023/05/27 09:56

javascript 暗号構文の解読を

ベストアンサー
o45t92
JavaScript
回答数1
2023/05/26 16:46

JS 簡単なコードで順位を上下反転できますか？

JavaScript 簡単なコードで順位を上下反転できますか？ここに１つのテーブルがあります。これを簡単なコードで順位を上下反転できますか？＜仕様＞・フィールド行（項目名）は最上位で固定・CSS または Vanilla JS ( jQuery 無用 ) ・チェックボックスでトグル <div><input type="checkbox" id="menu">逆順</div> <table id="table1" border="1"> <caption>ビタミンC 含有量トップ10</caption> <thead> <tr><th>順位</th><th>野菜名</th><th>含有量 (mg)</th></tr> </thead> <tbody> <tr><td> 1位</td><td>ピーマン(トマピー)</td><td>200</td></tr> <tr><td> 2位</td><td>赤ピーマン(パプリカ)</td><td>170</td></tr> <tr><td> 3位</td><td>芽キャベツ</td><td>160</td></tr> <tr><td> 4位</td><td>黄ピーマン(パプリカ)</td><td>150</td></tr> <tr><td> 4位</td><td>オレンジピーマン(パプリカ) </td><td>150</td></tr> <tr><td> 6位</td><td>ブロッコリー</td><td>140</td></tr> <tr><td> 7位</td><td>とうがらし</td><td>120</td></tr> <tr><td> 7位</td><td>パセリ</td><td>120</td></tr> <tr><td> 9位</td><td>なばな</td><td>110</td></tr> <tr><td>10位</td><td>カリフラワー</td><td>81</td></tr> </tbody> </table>

ベストアンサー
retorofan
JavaScript
回答数2
2023/05/25 08:40

JS 動的な作表コード：普通じゃ物足りない？

JavaScript 動的な作表コード：普通じゃ物足りない？動的に作表するには、次のメソッドが使われています。 createElement, insertRow, insertCell さて、これらを用いずに作表するにはどんなコードになりますか？下記のとおり、素材を用意しました。 <script> //表の名称 (caption) const title = "一般果物　エネルギー　上位１０"; //表の元データ (分割子は半角スペース) const data = ` 順位果物名含量 (Kcal) 1位中国栗 207 2位アボカド 178 3位日本ゆで栗 152 4位ドリアン 140 5位バナナ 93 6位あけび 89 7位チェリモヤ 82 8位アテモヤ 81 9位ホワイトサポテ 73 10位ぐみ 72`; </script>

ベストアンサー
retorofan
JavaScript
回答数2
2023/05/24 14:58

スライダーでオブジェクト変数の値を変更するには？

JavaScript スライダーでオブジェクト変数の値を変更するには？ <div id="wrap"> <div class="target">○</div> <div class="target">○</div> <div class="target">○</div> </div> <div>delay : <input type="range" id="delay_slider" min="0" max="100" value="0" step="10"> <span id="delay_slider_span">0</span> </div> <script> //全ての対象要素を取得して配列に変換 const targets = Array.from(document.querySelectorAll('#wrap .target')); const animations = []; //生成アニメーションの格納配列 //取得した要素にアニメーションを設定 targets.forEach((target, i) => { const animation = target.animate( [ { transform: 'translateX(0px)'}, { transform: 'translateX(60px)'}, ], { duration: 500, fill: 'forwards', delay: 0, endDelay: 0 } ); animation.cancel(); animations.push(animation); }); </script> スライダー要素を動かして、オブジェクト変数の値「delay」を変更するためにはどういうコードで実現できますか？くわしい方のお力添えをお待ちしております。

締切済み
retorofan
JavaScript
回答数4
2023/05/22 12:05

再挑戦：分割子が混在したデータの成型コードは？

<h1>JS 分割子が混在したデータの成型コードは？</h1> <pre> さまざまな分割子が混在したデータがあります。これを１つの分割子に統一するにはどんなコードでできますか？【仕様】 [分割子] ・二重引用符・一重引用符・タブ区切り　　・・・単語と単語の間・半角空白　　　　　　同上・パイプ（縦棒）・・・行頭と末尾に有る、無いの２ケース [データ型式] (注) 適合しないデータが含まれています１列目：３桁カンマ区切り２列目：文字データ３列目：整数・小数（負数を含む） [備考] ・空白行は詰める・エラーデータは「****」と出力 </pre> <pre id="data"> 1,234 あさがお 23.45 7,904 みかん 0.92 5,021 うさぎ 5.63 8,753 えんどう 1.724 2,657 いちご 10.87 9,841 ひまわり 77.33 432 ベニバナ 4.09 7,123 メロン 98.14 432 しらゆり 4.09 6,722 ナツメグ 65.1 "333,333","fish","67.82" "98,765","animal","26.5" "216,017","lion","5.74" "60,580","cat","31.07" "43,604","river","25.94" '90,742','lamp','0.45' '23,809','teacup','7.23' '3,582','dish','80.72' '5,600','stove','59.35' '4,65','soap','23.84' 9,001|violin|28.03 5,345|guitar|4.52 |4,890|goldfish|135.45| |2,8760|mountain|79.43| |5,032|radio|17.03| </pre> <div> <button id="button1">成型する</button> </div> <textarea id="output" cols=60 rows=30></textarea> <script> //例 button1.onclick = function(){ // step.1 データから、分割子を除いた単語として配列に格納 // step.2 エラーデータは「****」に変換 // step.3 分割子を指定してテキストエリアに出力 }; </script> くわしい方のお力添えをお待ちしております。

ベストアンサー
retorofan
JavaScript
回答数5
2023/05/20 05:00

特定の日付に対して、画面の表示がなされるように

特定の日付に対して、画面の表示がなされるようにしたいです。例えば、10月12日、11月3日、11月24日に実際になったときにだけ、画面に表示されるようにして、それ以外の日は、画面上に表示されないというのは可能ですか。以下を参考にしています。 http://r113.web.fc2.com/p/viewer/jrw-hokuriku-20150314/index.html 以下のjavascriptの文章を試しましたが、全然うまくいきませんでした。僕は天才じゃないため、断片的な情報から組み合わせて、一つのものを作り上げる能力はありません。ですので、断片的な情報ではなく、全部書いてくださるとありがたいです。 //ダイヤタイプの定義 const diagram = { WeekDay: 1, //平日ダイヤ Holiday: 2, //休日ダイヤ A: 3, //Aダイヤ B: 4, //Bダイヤ C: 5, //Cダイヤ } //ダイヤを判定する function dayJudge(year, month, date, day) { //フラグ（初期値：平日ダイヤ） var diagramFlag = diagram.WeekDay; //土日判定 if(day == 0 || day == 6) { diagramFlag = diagram.Holiday; } //特別な日 if((month == 10 && date == 12)||(month == 11 && date == 3)||(month == 11 && date == 24)) { diagramFlag = diagram.A; } else if(month == 5 && date == 25) { diagramFlag = diagram.B; } else if(month == 5 && date == 30) { diagramFlag = diagram.C; } return diagramFlag; }

ベストアンサー
sembokulove
JavaScript
回答数3
2023/05/19 16:43

JavaScript

カテゴリ 一覧

カテゴリ
一覧