JavaScript の質問用スレッド vol.125

2022/08/07(日) 15:57:40.26

!extend:checked:vvvvvv:1000:512
JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-5のテンプレを読んだ上で質問してください。次スレは>>950が>>2の「次スレの立て方」を元に立ててください

■質問を書く上で
(1) 煽り、コード制作依頼等、人を不快にさせる投稿はご遠慮下さい。公序良俗を守った応対を心がけてください。
(2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。
　　(ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など)
(3) 質問者及び議論を行う人はメール欄を空欄にし、名前にレス番を入れることを強く推奨します。回答者はなりすましを判断できませんので、なりすましが現れても自己責任となります。
(4) 常に自発的に調べる心構えを持ってください。
　　具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
　　わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
　　※必ず「問題の事象が再現されること」を確認してください。
　　　必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は http://validator.w3.org/ で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。>>2の質問テンプレートを活用してみてください。
(9) ライブラリ関連の質問は禁止です。関連スレにあるライブラリ質問スレで質問して下さい。
(10) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。

■前スレ
JavaScript の質問用スレッド vol.124
https://mevius.5ch.net/test/read.cgi/tech/1636525464/

VIPQ2_EXTDAT: checked:vvvvvv:1000:512:: EXT was configured

2023/04/26(水) 19:26:29.99

http://abehiroshi.la.coocan.jp/

この阿部さんのHPの左のフレームから「舞台出演」を取得したいんだけど、

const frame = await page.$('frame[name="left"]');
　const contentFrame = await frame.contentFrame();

こんな感じでcontentFrameを取得するところまでは上手く行くんだけど、

　const aElement = await contentFrame.$('body table.today tr:nth-child(8) td:nth-child(3) p a');

次の要素を取得する段階になるとnullになってしいます
どうすれば阿部さんの舞台出演を取得できますか？

2023/04/26(水) 20:39:08.46

>>798
.todayなんてclass付いてないぞい

2023/04/26(水) 22:57:11.72

それってJS？

2023/04/26(水) 23:08:17.75

そもそもnullを取得してるってことは所望のオブジェクトが取得できていないってことよん？

2023/04/27(木) 13:47:05.09

>>798
それ、ChromeのDevツールとかで、Elementの検索にセレクター入力してちゃんとヒットする？

2023/04/29(土) 00:34:06.33

['apple', 'パイナップル', 'pineapple (パイナップル)', 'りんご', 'pineapple']
を
['apple', 'パイナップル | pineapple', 'りんご']
に別名ふくめて重複削除して整形したいんですがスマートな方法ないですか

2023/04/29(土) 01:41:53.10

>>803
パイナップルの表記方法はどういう仕様なの？
スマートじゃない方法で実装できてるならそれを貼ってみたら？

2023/04/29(土) 01:58:50.79

>>804
別名がカッコで後ろに付く場合があったりなかったりをまとめたいんです
今は文字列に取り出して正規表現で割ってまた戻して～って頭悪くやってます

2023/04/29(土) 02:08:42.66

>>805
元の配列には、同じ値が複数、たとえば 'りんご' が何個も入ることがある？

ただ何にしても、現状がどの程度頭悪いのか分からんけどそこそこ泥臭くなるんじゃないかなぁ

2023/04/29(土) 02:20:05.97

>>806
あります

2023/04/29(土) 05:52:34.96

>>807
ちょっと面白そうだったので作ってみたけど、あんまりいい出来にはならなかった。
わざわざ見せるようなものじゃないんだけど、一応貼っとく。
アプローチとしては、単品アイテムまたは別名で括られた同一アイテム毎に配列実体を持たせて、重複排除しながらその実体に放り込んで最後に文字列化する。
複数の別名定義で 2つ以上の名前を括ったり、名前の登場順で連結するようにした。

https://i.imgur.com/tY8Yg78.gif

2023/04/29(土) 06:04:20.63

あわわ、26-32行目は整理できた

const new-content = [];
alias_ref[item] = alias_content.length;

2023/04/29(土) 20:12:37.30

JavaScriptでタイマー処理をしています。
指定した秒数（ここでは１０秒）経過したらタイマーを停止する様にしていますが
タイマーが止まりません。助けてください、、、

$(document).ready(function(){
$("#id_div_test").click(function () {
setInterval(TestFunction , 1000);
});
});

var i_current_second = -1;
function TestFunction()
{
i_current_second++;
if( i_current_second == 10)
{
clearInterval(TestFunction);
}
}

**502** (ﾜｯﾁｮｲ d501-nY3o [36.240.121.112]) · 2023/04/29(土) 20:34:34.21

>>810
使い方間違っとるな
そういうときはまずリファレンスを読め
https://developer.mozilla.org/ja/docs/Web/API/setInterval

2023/04/29(土) 20:36:30.58

clearIntervalの引数に入れるのはsetIntervalから帰ってくるnumber
型エラーでハマるのアホらしいしts使うか無理なら//@ts-checkをファイルの先頭に書いとけ

2023/04/29(土) 20:54:08.29

>>812
わかりません。。。どう書けば良いでしょうか？

2023/04/30(日) 00:03:19.23

>>812
できました！

2023/05/07(日) 14:48:48.64

>>810
こういうのはそのまんまChatGPTに聞けばヒントなり、回答、修正案なんかも返してくれ
る。
----
この問題は、`clearInterval`に渡す引数が誤っているために発生しています。`setInterval`に渡したのは `TestFunction`関数ですが、`clearInterval`に渡すのは `setInterval`が返すタイマーIDです。このタイマーIDは `setInterval`を呼び出すと返されます。

以下は修正されたコード例です。

$(document).ready(function(){
$("#id_div_test").click(function () {
var timerId = setInterval(TestFunction , 1000);
// タイマーIDを保持するために変数に代入する
});
});

var i_current_second = -1;
function TestFunction()
{
i_current_second++;
if( i_current_second == 10)
{
clearInterval(timerId); // 正しいタイマーIDを渡す
}
}

ここでは、`timerId`変数を`setInterval`の戻り値として宣言し、`clearInterval`に渡すようにしました。これにより、タイマーが正常に停止するはずです。

2023/05/08(月) 05:12:47.92

>>815
ここいらんやんけ…

2023/05/08(月) 09:31:16.79

>>815
setIntetval してるスコープの timerId を clearInterval するスコープから参照できる？

2023/05/08(月) 19:39:25.41

エラーが出たらまた聞けば直してくれる
あとほ聞き方の問題だね

2023/05/08(月) 22:29:23.94

>>815
え？そんな事までChatGPTできるの？？？すごくね？？
どんなシステムになってんだろ。

2023/05/08(月) 23:30:02.71

条件によってスクリプトを途中で止めさせたいんだけど三項演算子じゃreturnするしないを分けるのは無理？
if exitFlag return false

2023/05/08(月) 23:46:59.68

>>820
多分無理だと思うけど、なんで if じゃいけないの？

2023/05/08(月) 23:51:00.55

>>821
三項演算子の中で使ってるからなんか気持ち悪い

2023/05/09(火) 00:52:34.88

f = (flag) => flag ? false : true;

console.log(f(true));
console.log(f(false));

2023/05/09(火) 00:52:45.73

>>819
ChatGPTをプログラム用途で使ったこと無いなら一度つかってみると良いよ。
ググる手間がかなり少なくなる
もちろん、間違い返答の可能性もあるからそこら辺はうまく扱う必要があるけどね。
あとGitHub Copilotはもっとヤバいよ。プログラマーなら一度は使うべき

2023/05/09(火) 01:40:34.46

OSS のソース読むときにも ChatGPT は便利だよ。
内部関数名とか聞いても何するものか教えてくれる。
この間 OpenSSL のソース読んでて助けられた。
暗号のコードなんて読んでもよくわからないしw

2023/05/09(火) 07:51:33.95

>>824
GitHub Copilot
そんなのもあるんですね。

2023/05/09(火) 10:14:34.85

ChatGPTでsqlでハマった点を質問してみたんだけど
ヤバイな。一瞬で分かり易く解説してくれた。

どんなプログラムを組んでるんだ。凄すぎる。

2023/05/09(火) 14:59:12.62

chatGPTえぐいんですけど。

2023/05/18(木) 17:50:03.04

javascriptでctrl+Wでブラウザタブが落ちるのを無効にする方法はありますか？

2023/05/23(火) 06:51:40.61

それはJSの設定？Winの設定？

2023/05/23(火) 20:39:57.19

最近勉強してvarの何でもありな傍若無人さに気が付いた
例えば関数実行後に初期化してもホイスティングで勝手にundefiedが代入されるからエラーにならず混乱の素、
ブロックスコープ内で使うとその生成を無視するから混乱の素
なのでプロなのにES6以降の環境で未だにvar使ってる人って新人にも劣ると思った
ES6以降でEcmaから非推奨と言われてるのに未だにvar使わなければいけない理由ってある？
今後var使ってる人見たら問答無用で勉強しない人と判断しても良い？

2023/05/23(火) 20:57:14.94

キモ

2023/05/23(火) 22:34:28.22

>>831
>例えば関数実行後に初期化してもホイスティングで勝手にundefiedが代入される
これいろいろ間違ってる

>未だにvar使わなければいけない理由ってある？
REPLで繰り返しコードブロックを実行したい場合なんかにvar使う
あとはブラウザ以外の環境でES3しか動かない環境とかね

>今後var使ってる人見たら問答無用で勉強しない人と判断しても良い？
良いと思うけど君もそっち側に片足突っ込んでるから気をつけて

2023/05/24(水) 10:07:05.19

スコープの基本だね
レキシカルなのかパラメーターなのか
DOMをいじるとみんな参照になるし変数大切ね

2023/05/24(水) 10:45:52.94

匿名イベントを削除する方法って無い？
ググりまくっても全く見当たらんから仕方ないのでElement.prototype.addEventListenerフックしてフィルタしてるんだけど非常に遠回りな事してる気がしてならない

2023/05/24(水) 11:04:01.62

>>835
イベントリスナーへの参照を保持してないと
removeEventListenerは使えない
あとはAbortSignalを使う方法がある
MDNのaddEventListener辺りに全部書いてる

2023/05/25(木) 06:53:07.70

くそ素人で申し訳ない
ブックマークレットでCookieを編集する時に有効期限も同時に編集したいのだけれど
どうしたらいいのだろうか

元々は
javascript:document.cookie=%22ipb_member_id=〇〇%22;document.cookie=%22ipb_pass_hash=〇〇%22;

って感じなのだけれど1日くらいしたらすぐ消えてしまう

2023/05/25(木) 11:10:49.64

どっかのRFCに載ってるはず

2023/05/27(土) 14:04:26.57

>>837

そいつは有効期限も一緒に設定しなきゃならんな。

javascript:(function(){
var date = new Date();
date.setDate(date.getDate() + 30); // 30日後に設定
document.cookie = "ipb_member_id=〇〇; expires=" + date.toUTCString() + "; path=/";
document.cookie = "ipb_pass_hash=〇〇; expires=" + date.toUTCString() + "; path=/";
})();

こんな感じでやってみ。
これでipb_member_idとipb_pass_hashが
30日間有効になるぜ。
ただし、ブラウザの設定やCookieの設定によってはJavaScriptから触れないこともあるから、
その辺は自己責任でな。

2023/05/28(日) 15:24:03.43

documentのinnerHTMLやtextContentの書き換えをしたとき、ブラウザのDOMの計算（？）や再描画（？）は変更があった部分のみか、ページ全体で行われるののどちらでしょうか？

2023/05/28(日) 23:28:10.35

>>839
ありがとうまじ助かった

2023/05/29(月) 06:35:55.98

CookieってPHPみたいなサーバーサイドから設定するのとJSから設定するのどっちが良いんかね？

同僚から受け継いだシステムはPHPでやってたが

2023/05/29(月) 07:03:02.74

HttpOnlyの存在考えるとサーバーサイド一択じゃね？

2023/05/29(月) 08:05:53.64

ステートレスな通信を補助するものだから、処理の起点側でつけると良い
ただ、一般的にはサーバサイドになると思うよ

2023/06/19(月) 13:57:37.11

if ((a == b && c != d) || (e == f && g != h)){
alert ("正解");
}

こういうコードの書き方は出来ますか？
二重括弧の使い方は正しいでしょうか？

2023/06/19(月) 14:42:31.77

ちょっと調べてたんですが、こうでしょうか？

if (((a == b) && (c != d)) || ((e == f) && (g != h))){
alert ("正解");
}

「a == bとc != dの条件が両方ともtrue」か「e == fとg != hの条件が両方ともtrue」なら"正解"と警告を表示したいのですが…
三重括弧なんてあります？

2023/06/19(月) 14:49:42.42

>>845で大丈夫やろ。
なんで試さんの？

2023/06/19(月) 14:54:44.66

演算子優先度の理解が追い付いて無いなら好きなだけ括弧使えばいい

2023/06/19(月) 14:58:41.52

何重カッコでもいけるけど演算子やカッコが増えると可読性が落ちて条件式を読み解くのが辛くなる
コードは長くなっても条件式をいくつかに分割して変数に入れた方が読みやすくなるよ

const x = (a == b) && (c != d)
const y = (e == f) && (g != h)
if(x || y){
alert ("正解");
}
とか

2023/06/19(月) 15:02:17.21

皆さん、ありがとうございます
変数に入れるのがいいですね
やってみます

2023/06/19(月) 23:22:27.82

イテレータ、Map、Setがややこしくて😩なんだけど実務で使う？
一応理解したけどカスタムイテレータ作ってそれをオブジェクトに追加してfor...ofなんて無理だな
プログラマーならバリバリ使うのかな？それとも知識として仕組み知っとくだけ？

2023/06/20(火) 13:18:59.52

Mapはキーと値の組み合わせのコレクション
Setは重複のない値のコレクション
どちらも実務で出番はある
イテレータは中身を1個ずつ取り出せるものの総称

カスタムイテレータに関してはmdnもおすすめのジェネレータ関数を覚えておけばいいかと
バリバリではないにしてもここぞというときに役に立つ

2023/06/21(水) 18:20:14.61

tableタグのtrをjqueryかjavascriptでアニメーションアコーディオンがうまくアニメーションしないんだけど
slideToggleで開発ツールではheightの数字は変化しているんだけど・・
もしかしてtrにheightという概念が無いから？

<tr class=name><td>名前1</td></tr>
<tr class=detail><td>中身1</td></tr>
<tr class=name><td>名前2</td></tr>
<tr class=detail><td>中身2</td></tr>
・・・

2023/06/26(月) 12:08:05.73

変数って定義する前はundefinedが入ってるんでしょうか？

2023/06/26(月) 20:02:32.96

>>854
変数定義前は変数がない
変数定義時に値を代入しなければundefinedで初期化される

2023/06/26(月) 21:13:06.03

>>855
ありがとうございます。

2023/06/29(木) 21:35:42.23

Promiseメソッドなんなの独自ルール多すぎでしょ。もはや別言語に感じる。これよく使用される？

2023/06/29(木) 22:34:31.96

Promise周りは最初は取っつきにくいけど、凄く使いやすく作られてるし、物凄くよく使うよ。

2023/06/29(木) 23:09:38.14

async awaitでしかfetchをかけない自分と、thenでしかfetchを書けない前任者のせめぎあい

xhrはなぜか知らんがもう時代じゃないらしいし

2023/06/30(金) 10:14:20.96

的外れな質問だったら申し訳ありません…
クラスAが長くなってしまったこと(1500行くらい）、類似クラスBとある程度共通化できそうな部分があったので関数Cとして
別ファイルに切りだそうと思いました。
その際、関数CからAの複数のメンバ変数/メソッド（Bも同じ名前の変数/メソッドを持っている）を利用したいのですが、
一つ一つ引数で渡していくと記述が煩雑だし、仕様も変わる可能性があります。
そこで、Aのインスタンスから関数Cにthisを引数として渡すようにして、関数Cからは仮引数this.メンバ変数などのようにして自由にAのメンバにアクセスできるようにしました。

以上のやり方で、動作はしているようですが、なんか良くないやり方の様な気もしています。
上記のやり方は一般的な方法でしょうか。何かデメリットはありますでしょうか。

2023/06/30(金) 10:55:58.80

クラスAたBの同名の変数と関数をBaseクラスにしてAとBに継承すれば同名の変数関数を持ってることが保証できてうっかり名前変えてしまったとかのバグ防げるんじゃない？インターフェースみたいに
それから引数じゃなくてbind使えば関数C内でthisを自然な感じで使えるとか

2023/06/30(金) 13:05:23.88

有り難うございます。
デメリットとしては後でA~Cをいじった時にバグの温床になりやすいこと、くらいの認識で良いんですかね。
基底クラスを継承するかたちにすることも考えたいと思います。
確かにbind/callを使った方が、動作は同じでよりシンプルな気がしてきました。

2023/07/01(土) 04:46:01.59

is_a, has_a

継承か包含か、古典的な質問

2023/07/01(土) 19:38:17.78

javascript:
if((result = prompt("input formula string","")) == "") alert("no formula string"); else alert(eval(result));

2023/07/01(土) 22:48:30.73

なんつー邪悪なコード

2023/07/05(水) 21:30:37.79

(function(){
　～
})();

こういう書き方をしてるコードがあったんですけど、これは実行も含めた関数の書き方でしょうか？
最初の(と最後の)()の意味がわかりません

2023/07/06(木) 00:31:51.01

>>866
即時関数
()は関数宣言ではなく、関数式として実行するため

2023/07/06(木) 01:40:00.57

>>867
ありがとうございます
よくわかりました

2023/07/07(金) 13:17:53.80

なるべく自分で考えたキモイ名前は晒したくないからな？

2023/07/08(土) 18:01:12.76

今ホームページを制作しているのですが教えて頂きたいです。
下記内容のコードの書き方がわかりません。

5枚の画像があるのですが、全部では無く一旦一枚目のみ表示させたいです。
次に各画像を説明する文字があります。その文字にマウスカーソルを合わせると、その文字にあった画像に2枚目3枚目と切り替わるようにしたいと思っています。

初心者すぎるので例としてコードを作って頂ければ見ながら調整したく思っています。
どなたかお教え頂けませんでしょうか。

2023/07/08(土) 20:53:43.61

>>870
それはもう質問ではない

2023/07/08(土) 21:24:42.99

ChatGPTに聴け

2023/07/08(土) 23:32:58.73

>>870
質問にするなら>>1-3を読もう

2023/07/09(日) 01:18:13.12

よくある、スライダーでしょ？
jQuery でもあるでしょ

Bootstrap のCarousel (カルーセル)
https://getbootstrap.jp/docs/5.0/components/carousel/

2023/07/09(日) 01:44:11.98

なんか色々ルールがあるんですね
諦めて勉強します
ありがとうございます

**874** (ｱｳｱｳｳｰ Sa55-knyK [106.146.114.68]) · 2023/07/09(日) 19:52:50.68

jQuery slider
Bootstrap Carousel などで検索すれば、一杯ある

一杯あるけど、難しいから自作する人はいない。
皆、jQueryUI やBootstrap のCarousel などの既製品を使う

2023/07/09(日) 21:16:30.84

え、そんな難しい要素無いよ

2023/07/17(月) 23:23:58.12

フォームフィールドが定義されたPDFファイルがすでにあって、ブラウザ上のJavascriptでWebフォームに入力されたテキストをPDF側のフィールドに反映させてダウンロードすることができるpdfライブラリってあまりすか？

使い方のイメージとしては、たとえばPDF上に名前を入力する箇所がいくつかあるけど、ユーザーは単にweb上で普通のinputフォームを入力してsubmitすると名前が入力済みのPDFファイルをダウンロードできる、という感じです。

pdfmake等いくつかライブラリは見たのですが、白紙ベースでPDF作る例しか見あたらなくて(テンプレートは画像背景で切り替え等)、直接PDFフォームを扱えるものは無いかなと。

2023/07/29(土) 00:54:23.66

プログラミング全く知らない状態からやっとJavaScript一通り学びました
かなり難しかったです。でもJavaScriptは比較的簡単な言語なんですよね？
ES6以降のJavaScriptでもやっぱり簡単なんですか？
それとES6で大規模アップデート合った時は絶望しましたか？
勉強していて苦しんだのがスコープ、this、反復処理の背景（iteratorの動き、yieldは何をしてるか）、非同期処理（Promise、then、async）、その他様々なメソッド、静的メソッド、、、
これら全てES6から導入されましたよね？絶望しませんでしたか？
例えば私がもしES5までのJavaScriptに慣れ親しんでいてES6のアップデートに触れたら絶対絶望してました。概要見ても「？？？？？」となってたはずです
プログラミングに向いてる人はこんな大規模アップデートがあるとワクワクする人なのでしょうか？
絶望せず、「何ができるようになったんだろう！凄い！こんな事やあんな事が出来る！」みたいな人も居ましたか？

2023/07/29(土) 08:26:35.15

ES5までは貧弱だったのでそりゃもう大歓喜よ。
それと現代のJavaScript（を使いこなすの）はもはや簡単な部類じゃないように思う。

2023/07/29(土) 09:45:27.72

苦しみとか絶望とか>>879は言語の習得を学校の勉強と同じようなものとしか捉えてないフシがある
日本史の勉強範囲が大政奉還までだと思ったら第二次大戦までだった！みたいな感覚

新しく覚えたことは実際のプログラミングで活かせるんだという意識が全く感じられない

2023/07/29(土) 14:21:53.16

>>880
>>881
とにかく理解するのに必死で苦しみました。jJavaScriptが簡単とは全く思いませんでした

2023/07/29(土) 14:27:58.50

try,catch,finally文の存在異議が分からなかったけど、今さっき急にasync/awaitのエラーハンドリングに向いてるのに気が付きました
つまりthen,catchのPromiseチェーンをより楽に書けるのに今さっき気が付きました。こんな感じで上手くいかないですね

2023/07/29(土) 15:03:53.70

.then().catch()の方が綺麗に書けて（副作用的な意味で）好きだなぁ

2023/07/30(日) 02:24:04.00

>>879
言語として簡単かっていうとどうだろうね。
Webブラウザがあれば動かせる上にデバッグ環境まで付いてるから、誰でもすぐ始められるし、作ったものをどこででも動かしてもらえるという手軽さはあると思うけど。

2023/07/30(日) 14:24:24.68

自分はプロトタイプ型オブジェクト指向から入ったから気にならないけどクラス型でプログラム書いてた人は違和感凄いんだろうな

あとクロスブラウザ対応しなきゃいけなかった人達もJSはしんどかったんだろうなと想像

2023/08/04(金) 01:16:43.56

rd41 = "";
alert (rd41);
これで「rd41は未定義です」ってエラーは出ますか？

alert(rd41);
これだけだと「rd41は未定義です」ってエラーが出ますよね

実際のコードはalertでは無いのですが、rd41に無を代入して何も表示させたくないのです
rd41 = null;
だと、nullと表示されてしまいます

2023/08/04(金) 01:36:14.69

chatGPTに質問したら答えが返ってきた
https://i.imgur.com/5NbJI6w.jpg

2023/08/04(金) 09:00:08.06

>>887
delete を調べてみるとどうだろう。
やりたいことによってはブロックスコープで足りるかも。
個人的にはブロックスコープを活用して、変数を小まめに狭い範囲に閉じ込める書き方をおすすめしたい。

2023/08/04(金) 09:14:51.09

>>887
ECMAScriptに「未定義」というエラーはない
Strict Modeで実行すれば、両コードともにReferenceErrorになるだろう
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Strict_mode
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError

2023/08/04(金) 09:37:58.66

>>887
>rd41 = "";
>alert (rd41);
>これで「rd41は未定義です」ってエラーは出ますか？
なんで試してみないの？

2023/08/14(月) 23:07:53.97

時報みたいなのを作成中でそのhtmlのページさえ開いておけば
9時、12時、18時(プリセットとかは無く固定)に特定のwavサウンドファイルがaudioElement.play() で再生される用にしています
(タブが非アクティブだとなんか動かない時があったのでwindow.openで表示させてます)
chromeのポリシーみたいなのでユーザーが明示的なアクションをしないと音声の自動再生はされないみたいで
それの良い回避策ってありますか？
実用性考えると携帯のアラームが百倍使いやすいけど
自分用にチープなのを作って遊んでるんだけど解決策が思いつかなくて・・・

2023/08/15(火) 01:53:58.77

>>892
そういう質問はchatGTP得意や
聞いてみれば

2023/08/21(月) 00:13:21.70

【環境】Windows 11, Chrome最新版
【何をしたのか】PHPで動的に出力されたテキストに replace (new RegExp）
【エラーメッセージ】コンソールには何も出ません
【期待する結果】ページ内に複数生成される動的クラス内テキストを置換したい
【サンプルコード】
おはようございます*2023.08.150000
ごきげんよう*2023.08.200000
・
・

tx-dateクラスの中身をtx-bodyの*以降の文字列に置き換えたく、以下を<body>の後半に書きましたが期待する置換変化が起きません、エラーも出ません、
根本的なところわかっていないのだと思うので恐縮ですがお手上げ状態です

window.addEventListener('load', function() {
const ItemList = document.getElementsByClassName("tx-body");
const ItemDate = document.getElementsByClassName("x-date");

for(i=0; i<ItemList.length; i++) {

var tBody = ItemList.item(i).textContent;
var tDate = ItemDate.item(i).textContent;
var replaceDate = tBody .split("*")[1];

tDate = tDate.replace(new RegExp(replaceDate,'g'),'');
}
})

以上ご指導よろしくおねがします

2023/08/21(月) 11:40:28.26

>>894
まずconsole.log()や開発者ツールを使って自分の書いたコードがどこまで想定通りに動いてるか確認してみよう

2023/08/21(月) 11:51:22.81

>>894
コードを見る限り、置換を行うためのコードは一見正しく見えますが、複数の潜在的な問題が考えられます。まず、コード内のいくつかのポイントをチェックしてみましょう。

1. **クラス名のスペル**: `tx-date` クラスが正しく `x-date` クラスになっているか確認してください。

2. **期待する置換変化の確認**: 期待する置換変化がどのようなものか確認してみてください。コード内で `tDate` の内容を `console.log()` を使って出力し、実際の値が正しいか確認できます。

3. **変数 `replaceDate` の設定**: `tBody.split("*")[1]` の部分で、正しい位置に `*` が存在しているか確認してください。`split()` メソッドは対象の文字列を指定の文字で区切って配列にしますが、もし `*` が存在しない場合、期待通りの結果が得られない可能性があります。

4. **置換操作の適用**: `tDate` に対して行った置換操作が、実際のDOM要素に反映されていない可能性があります。`tDate` の内容を変更した後、対応するDOM要素の内容を更新するコードが不足しているようです。

これらのチェックポイントを確認した上で、コードを修正するか、デバッグすることをお勧めします。また、具体的なサンプルHTMLコードや置換の例を提供していただければ、より具体的なアドバイスを提供できるかもしれません。

2023/08/21(月) 12:25:10.86

このﾜｯﾁｮｲ **4bは質問スレにchatGPTの回答貼るだけのボットみたいなもんだからスルー推奨
NG入れといてもいい

2023/08/22(火) 23:04:06.56

2か所とも、clas="tx-date" になっている！

class でしょ