+ JavaScript の質問用スレッド vol.124 +

2021/11/10(水) 15:24:24.80

JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-6のテンプレを読んだ上で質問してください。次スレは>>950が>>2のテンプレ案(本スレで改善案があれば考慮)を元に立ててください

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

※前スレ
+ JavaScript の質問用スレッド vol.123 +
https://mevius.5ch.net/test/read.cgi/tech/1491143438/

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

2022/07/09(土) 00:33:28.58

>>880
やはり…そうか
配列にしたいからJSONにしてるのか？

2022/07/09(土) 00:44:35.23

>>882
もとはこちらでした。SQLに必死でこーどがきえております。
https://wandbox.org/permlink/fhJ2DJMkP50tbNRn

2022/07/09(土) 00:45:00.56

>>882
条件は日付と更新日です
日付だけでも良いのですが

2022/07/09(土) 00:46:14.61

archive.phpの254行目からSQLを組んでいます。

2022/07/09(土) 00:47:27.37

>>883
配列にしたいからですね

2022/07/09(土) 00:57:10.79

>>885
>AND (post.post_date LIKE %s OR post.post_modified LIKE %s )
この部分？
これに配列渡すつもりでいるの？

2022/07/09(土) 01:03:38.45

>>888
$query = $wpdb->prepare($sql, "%$search_query%", "%$search_query%");

配列はこの部分ですね

2022/07/09(土) 01:04:31.60

ANDはwordpressのテーブルからカラムで条件を引いてます

2022/07/09(土) 01:08:11.05

>>889
$search_query変数が配列？
$search_queryに具体的にどんな値が入ってる想定なのか書いてみなよ

2022/07/09(土) 01:20:47.68

>>891
よく考えてみると$date_queryかもしれません。
検索は出てきたんですが、アーカイブが出てこなかったためsearch_queryにしてましたが…

2022/07/09(土) 01:26:28.50

>>892
変数名はこの際どうでもいいよ
SQLにどんな値を渡したいのかが知りたいんだから

2022/07/09(土) 01:28:08.76

php get_search_form(); で貰ったワードから検索ページのSQLは出力されています

アーカイブページもおそらくwordpressの既存のアーカイブをクリックしてSQLに繋がるはずです

この配列の渡し方もよく分かってない状態です…

2022/07/09(土) 01:31:51.09

>>869,877,880,887
要件
- front-page.phpにselect要素で年月のブルダウンメニュー設置
- front-page.phpの入力値をAjaxでarchive.phpにリクエスト
- archive.phpでパラメータを配列で受け取る

実装
1. front-page.php: のselect要素で配列にしたいもののname属性値に [] をつけておく
2. front-page.php: Fetch APIでFormDataをarchive.phpにリクエスト
3. archive.php: 受け取った配列を元にSQL文生成→クエリを発行→結果をJSONで出力
4. front-page.php: JSON.parse()して後続処理

SQLの下りはPHPの処理なので、ここでは言及しない

2022/07/09(土) 01:39:36.21

>>894
検索ページのSQLってのはsearch.phpの258行目からのこと？
こっちは$search_query変数はただの文字列でキーワード検索してるんじゃないの？

2022/07/09(土) 01:45:04.90

>>896
そうですね…

という事は$date_query＝配列or変数で渡せば過去の記事をSQLで検索する仕組みになりますかね…

2022/07/09(土) 01:52:27.26

>>895
- front-page.phpの入力値をAjaxでarchive.phpにリクエスト

についてお聞きしたいんですが、これはフロントデータの送受信にあたらないのでしょうか？
wordpressはJavascriptとjQueryから受け取ることも渡すことも出来ません

2022/07/09(土) 01:57:57.75

>>897
だからなんで配列にこだわるの？
"%$search_query%"って使ってる以上配列は受けとれんでしょ
文字列変数で"%2021-01%"とかではあかんの？

2022/07/09(土) 02:01:20.50

>>899
いえ配列である必要はないですが、SQLで検索する際に文字は無理だと思うので、一回デコードしてデータにする必要があると思います…

2022/07/09(土) 02:02:16.29

>>898
勿論、フロントデータだ
HTMLに書かれたselect要素に入力されたデータはクライアントサイドの情報だからな

WordPressがフロントデータを受信できないのなら、プルダウンメニューに入力された情報をWordPressで受け取る手段がないことになる
ブラウザを使えないようだから、サーバにtxtファイルをアップロードするとか、手段を変えるしかないのでは?

2022/07/09(土) 02:07:50.54

>>901
やはり1回クッションを挟む必要があるんですよね？

ただ厄介なのはSQLからも送れないことですねwordpressの SQLなので記事の情報を全てファイルに送ってそれを再度Javascriptに送り返す必要があります

2022/07/09(土) 02:09:25.27

皆さんアドバイスありがとうございます
とても勉強になりました

2022/07/09(土) 02:09:27.83

>>900
>SQLで検索する際に文字は無理だと思うので
何を言いたいのか分からん
post.post_date LIKE '2021-01%'
って検索条件にすれば2021年1月の記事は検索できるんじゃないの？

2022/07/09(土) 02:11:17.73

>>904
直打ちは考えた事がなかったです…
たしかに可能かもしれません

2022/07/09(土) 02:13:21.75

>>905
直打ちしろとは言ってない
文字列変数で済むだろってこと

2022/07/09(土) 02:14:16.13

>>906
文字列変数ですね、失礼致しました。

2022/07/09(土) 02:16:02.68

あと君さ、物を知らなくて教えを乞う立場なのに～出来ません、～必要がありますとか断定形使うのやめようよ
君の知らない解決方法なんていくらでもある

2022/07/09(土) 02:21:08.51

>>902
1回クッションとは？

フロントデータを受け付けないとは、通信を受け付けないということ
そんなWordPressがあるなら、ブラウザでWordPressを閲覧することすらできない
前提がありえないと俺は思うけどね

あなたは通信周りの知識がかなり怪しい
PHPも明らかに基礎知識が不足してる
この課題は今すぐ解決は諦めて、入門書から始めるのが妥当なんじゃないと俺は思う

2022/07/09(土) 02:22:46.19

>>907
で、SQLが配列やオブジェクトを受け取る必要がないなら画面からは年のselectから2021を、月のselectから1を渡せば済む話じゃないの？

2022/07/09(土) 02:31:00.30

>>908
申し訳ありませんでした。
以後気をつけます。

2022/07/09(土) 02:33:37.34

>>910
たしかに渡す時は簡単な処理で良くなりそうですね

逆に渡す時はファイルを経由してAJAXが必要になりそうですが

2022/07/09(土) 02:34:45.13

>>909
外部のJavascriptとjQeary限定ですので内部データは受け付けてるのではないでしょうか

2022/07/09(土) 02:35:31.13

> wordpressはJavascriptとjQueryから受け取ることも渡すことも出来ません

これが真実なら、>>877のAjaxがそもそも不可能だし、なぜJavaScriptスレで質問してるんだ？、という話になる

>>912ではAjaxが実装可能かのように書いてるし、説明がちぐはぐ

2022/07/09(土) 02:36:16.13

>>909
完全に同意する
プログラミング全般についてもググって言葉はあれこれ知ってるけど
知識として吸収できてなくてそれらが繋がってないと感じる
こちらから伝えてることも正しく理解できてないだろう

これ以上続けても得るものも少ないだろうし何よりスレ違いだしここまでにしとく
長々とレスしてしまって申し訳なかった

2022/07/09(土) 02:38:54.67

>>913
WordPressから見て、内部データといえるのは、サーバ上に置かれているデータだけ

HTML,JavaScriptは外部データ
ブラウザで入力される文字列も外部データ

2022/07/09(土) 02:41:49.97

>>915
俺もこの辺で引こうと思う
お疲れ様

2022/07/09(土) 02:48:31.51

>>916
朝起きてからwordpressの問い合わせフォーラムでもう少し詳しく聞いてみます

2022/07/09(土) 05:00:15.88

完全にスレチ

2022/07/09(土) 08:04:40.38

またあちこちに場違いで意味不明な質問をバラ撒いて場を荒らしていくのだろう

2022/07/09(土) 10:02:17.20

プログラミングって「とりあえずやってみて、分からない所を調べる」
ってやり方すると信じられないぐらい余計に分からなくなるからな
体系的に一回勉強して全体のシステムイメージとか
実装のイメージとかがある程度掴まないとマジで意味不明な事をやりだす……

2022/07/09(土) 17:10:46.65

YouTube で有名な雑食系エンジニア・KENTA の初心者向けRuby on Rails サロンでは、
半年でポートフォリオを作って転職していく

KENTA は、PHP, Scala をオワコン認定した。
プロは今後、これらの言語で作らない

Rails以外では学習環境がないから、勉強できない。
本屋でWord Press の本を見たけど、ソースコードを書いているような本は無かった。
あるのはデザインの本ばかり

一方Railsなら、黒田努の3冊の本とか、パーフェクト Ruby on Rails、
Ruby on Rails 6 エンジニア養成読本とか、他の著者の本も何冊かある

Rails Guide, Rails チュートリアル、
YouTube のDean など一杯ある

KENTAのサロンには、日本6位の3千人が入っている。
1位はキングコング西野の数万人。
ガーシー・参政党なども、数万人ぐらいかな？

2022/07/09(土) 20:22:33.93

なんやかんや言いながら、突き放さずに細かくアドバイスしてる諸兄の面倒見の良さにホッコリしたわw

2022/07/09(土) 21:18:10.25

正直後悔してる
まず相手のレベルを見定めるのが重要だと悟った
理解できるレベルに達してない相手にアドバイスとか虚無以外の何物でもないわ

2022/07/09(土) 21:42:04.17

いきあたりばったり感が前スレのYAGNIの人を彷彿とさせるな

2022/07/10(日) 02:20:27.58

>>925
思想は同じだと思う

(A) 必要になったら調べる(体系的な学習はしない)
(B) 足りない知識は妄想で補完する
(C) 苦言は聞き流す

本人としては調べる時間を極限まで減らして効率的に学習しているつもりなのだろう
実際は理解できてなくて、無駄に学習時間を減らしてるだけだが

2022/07/10(日) 11:37:41.66

まだプログラミング始めて間もないのかと思ったら1年とかやってるのか
https://teratail.com/users/homepage-site?feed=question

質問もいろいろアレだけど限界まで考えたとかあらゆる方法を試したとか言えちゃうのはすごいな

2022/07/13(水) 14:00:11.96

一応方法はわかりました。
WordPressを通せばそれ自体がフロント動作をしてしまうので、
全部ぶった切って、APIとしての出力＝VIEW
STDINを乗っ取ってWordPressの初期化経路を通さずに、
DBを使う

2022/07/13(水) 15:08:50.99

ここのスレの住人は自称プログラマーのアホ無職ばっかりだからマトモな回答は得られないよ

続きはコッチでやればいいよ。親切な達人プログラマーが懇切丁寧に教えてくれるから
↓
Ruby 初心者スレッド Part 67
https://mevius.5ch.net/test/read.cgi/tech/1608837867/

2022/07/13(水) 15:42:32.38

JavaScript の質問者をRuby板に誘導する無能あらわる

2022/07/13(水) 15:49:35.21

>>928はWordPressの質問をJavaScriptスレで質問した質問者の手落ち
マルチポスト先を含めて多くの回答者の時間を無駄にさせた

2022/07/13(水) 16:05:33.79

>>927見たら質問が増えててまだ配列をSQLに～とか言っててため息しか出ない

2022/07/13(水) 16:26:27.80

rubyスレがスレチの質問で溢れかえる分には俺は困らんから好きにすればいいよ

**922** (ﾜｯﾁｮｲ 262c-0UEB [153.176.51.249]) · 2022/07/13(水) 18:08:13.50

>>922
に書いた

学習環境が無いもので開発したら、勉強できないから数年以上掛かる

一方、Ruby on Rails なら学習環境があるから、
半年ぐらいでポートフォリオを作れる

大切なのは何かを勉強する事ではなくて、勉強する方法を勉強すること！

どういうやり方をすれば、勉強・上達できるのか。
これが成長には大事。
企業が求める自走力。自分で探して解決する能力

だからKENTA が、Django, Laravel で作っても採用されませんと言うわけ。
技術選定で、Railsよりも、Django, Laravelを選んだ理由は何ですか？と聞かれる。
答えられないでしょ

単にこの香具師は、調べる能力がない・適材適所ではないと思われるだけ

2022/07/13(水) 22:31:32.60

>>921
僕のディスはそこまでにしてw

2022/07/14(木) 20:00:33.34

「とりあえずやってみる」の人によりけりだから、話が通じにくいね
入門書を一通りまねてみるってなら有りだろ
問題は、初心者がよい入門書を判別できない

2022/07/14(木) 22:34:10.26

僕は、逆引きから入るのが良いかもしれないと思ってる人です。
やりたい事がタイトルになってて、サンプルコードも載っている書籍からプログラミングの入り口にちょうど良い気がしています。

2022/07/15(金) 10:12:59.14

>>929
Rubyセレでもスレ違いの質問は受け入れられないそうだ
https://mevius.5ch.net/test/read.cgi/tech/1608837867/462-

2022/07/17(日) 12:49:24.94

すいません、
文書の中から決まったパターンに合致する部分を全部抽出して配列にしたいので、
matchと正規表現を使ったのですが結果が惜しいです…

a href="hoge"
の「引用符内のみ」を抽出したいので
let regexp = /a href="(.*?)"/;
と書いたのですが結果は
a href="hoge"　と丸ごとごろっと抽出されてしまいます

普通にdocument.getElementsByTagName("a");でDOMアクセスすれば？
と思われるかもしれませんが、XMLhttpRequestで取得したテキストなのでできません

どなたかアドバイスいただけないでしょうか

2022/07/17(日) 13:03:11.91

まずはそのコードを提示して

2022/07/17(日) 13:09:51.96

>>939
DOMParser使えば？

2022/07/17(日) 13:10:59.56

こうでしょうか

　const loadText=//aタグが入ったhtml文書ならなんでも
let regexp = /a href="(.*?)"/g
let result = loadText.match(regexp);
console.log(result[0]);

2022/07/17(日) 13:11:37.96

>>939
正規表現でも出来なくはないが、DOMParserやinnerHTMLでDOMに変換するのが確実だと思うぞ

2022/07/17(日) 13:12:39.13

>>939
const targetText = 'aaa"bbb"ccc"ddd"eee"';
const quart = targetText.split('"').filter((e, i) => i % 2 && e != '');

これじゃダメかな?

2022/07/17(日) 13:17:54.06

みなさんありがとうございます！

DOMパーサーってやつ使ったらできました！DOMParserすごい！
正規表現のやり方も後でためしてみます！

2022/07/17(日) 14:21:17.89

result[0] だから全部返ってきただけじゃね？

2022/07/17(日) 16:14:33.63

>>942
let regexp = /a href="(.*?)"/g
console.log(result[0]);
↓
let regexp = /a href="(.*?)"/
console.log(result[1]);

gフラグの有無で返り値が異なる
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/match

2022/07/17(日) 21:17:50.79

>>945
・属性値がダブルコーテーションで括っている
・属性値内のダブルコーテーション、<>がエスケープされている

上記条件を満たすならば、
/<a\s[^>]*href\s*=\s*"([^"]*)"/i.exec('<a class="foo" href="bar.html">')[1]; // "bar.html"

2022/07/17(日) 22:54:51.79

キチャナイ

2022/07/18(月) 19:41:18.90

javascriptで金稼げますか？(´・ω・`)、、、

ストップウォッチ

2022/07/18(月) 20:26:01.15

とりあえずやりたいことは地図のヒートマップを作ることです
https://todo-ran.com/t/kiji/11846
こんなのはリアクトで作れますかね

2022/07/22(金) 00:25:43.27

>>951
スレッドストッパー力半端ないですねw

2022/07/25(月) 17:18:57.58

初歩的な質問で申し訳ありません
英単語学習用のタイピングゲームを作ってましてその要素が1000ほどあるのですが
csvからランダムに取り込むことは可能でしょうか？
やはり一度コードに記述した方がいいのでしょうか？

2022/07/25(月) 17:26:43.95

当然だけどローカルのファイルを直接は扱えない
input fileなどでファイルを指定してそれを解読することは可能だが
ゲームみたいなデータなら予めそのデータをコードにしておいた方が良いだろうね

2022/07/25(月) 17:31:13.98

>>953
もちろん可能
どういうアーキテクチャで実装したいのかによってやり方が違ってくる

2022/07/25(月) 17:47:36.16

>>954
ありがとうございます
やはりコードにしておいた方がいいのですね
レベル分けで3セクションに分けて記述してみます。

2022/07/25(月) 17:49:54.22

>>955
ありがとうございます
できるんですか？？
簡単な自己満ゲームなのでブラウザ上で動けば問題ない感じです。

2022/07/25(月) 20:08:35.78

>>953
ぜひ完成させてください。
遊んでみたいです

2022/07/25(月) 20:32:00.49

>>958
ありがとうございます
いま、英語の大文字が反応しなくて困ってます。
条件式でシフトを押しながら入力する記述をすれば良いとのことですが、具体的にどんな風に書けば良いでしょうか。

2022/07/25(月) 20:34:39.14

あと、アポストロフィも認識できるようにしたいのですがご教示くださると幸いです。

2022/07/25(月) 20:38:46.87

ブラウザの方がcsvにランダムアクセスするのかえって面倒な気がするが・・・

2022/07/25(月) 20:42:57.38

>>961
ありがとうございます。
ちょっと時間かかりましたがコード内の配列に記述しました。

2022/07/25(月) 21:20:37.02

>>959
具体的なアドバイスが欲しいならせめて今どういうコードになってるのかぐらい貼ろう

2022/07/25(月) 22:38:29.79

漏れは、英単語テストのアプリを作っているけど、
word.json ファイルに、中高生の単語を書いて、それを読み込むようにしている

[ ["accept","…を受け入れる" ],["achieve","…を達成する" ] ]

ブラウザ用のモジュールで、CSV を使えるものもある？
サーバー用のモジュールなら、あるだろうが

2022/07/26(火) 01:47:59.80

>>964
https://www.google.com/search?q=javascript+csv+parser+-node.js+rfc-4180

2022/08/06(土) 22:44:05.88

<img src="./test.png" id="test">
これにjsであとからリンクをつけるにはどうやったらいいですか？
htmlで書くと<a href="../"><img src="./test.png" id="test"></a>
のようにです

2022/08/06(土) 23:00:00.17

test.outerHTML = `<a href="../">${test.outerHTML}</a>`

2022/08/06(土) 23:18:20.35

>>967
ありがとうございます。
$はどういう意味ですか？

2022/08/06(土) 23:23:20.66

テンプレートリテラルで調べてください

2022/08/06(土) 23:59:57.44

jQuery なら、

<img src="test.png" id="test">

$( function ( ) {
// 画像リンクを作る。$( 子 ).wrap( 親 );
$( "#test" ).wrap( "<a href='index.html'></a>" );
} );

変換後
<a href="index.html"><img src="test.png" id="test"></a>

2022/08/07(日) 00:08:55.51

PHPでもこんな書き方あるよね

2022/08/07(日) 00:23:34.07

PHPはオワコン。
それに初心者には難しすぎる

初心者はRubyから始めるべき

こっちのスレで質問すれば親切な達人プログラマーがどんな質問にも懇切丁寧に答えてくれる。
　↓
Ruby 初心者スレッド Part 67
https://mevius.5ch.net/test/read.cgi/tech/1608837867/

2022/08/07(日) 03:30:30.75

質問です。仕事の業務を効率化したいです。
とあるサイトにログインし、
そのページにある　「30個のボタン」　をクリックするという作業を毎日しているのですが、30回クリックする作業を簡略化したく、方法を模索しています。
　（30個のクリック後の動作はそれぞれ
　「斎藤さんにメールを送る」　「田中さんにメールを送る」
といった感じのものです　（例：send_TANAKA、send_SAITOU…）
　（↑クリック後の動作は　必ず　send_　という文字列から始まります）
　（斎藤や田中といった名前は100人以上の会員名からランダムに選ばれています）

chromeのデベロッパーツールで
クリックした後の動作を　コンソールで直接実行すれば可能であるのは分かったのですが　(send_TANAKA 等と直接コンソールに記述する）
30個のclick動作を記述するのは手間がかかるため
もっと効率のいい方法を探しております。どなたか知恵を貸してください。
　sendという文字列を含む命令を30個探し、それらを上から順番に実行する、といったことをコンソール上で実行したいです

2022/08/07(日) 03:47:36.25

ボタンをクリックすることとJavaScriptの関係が書いてないうえに、ボタンをクリックすると何が起こるのかさえ書いてない。

何をどう答えろというのか？

2022/08/07(日) 03:48:21.96

>>973
それ広告か？

2022/08/07(日) 06:59:14.67

メタプログラミングか？

文字列で、関数名を作って呼び出す？

2022/08/07(日) 07:16:41.96

ブラウザを自動で操作するってやつでは？

2022/08/07(日) 09:40:14.60

趣味でJavaScript(vscode+nodejs)を勉強してます。
まだよく分からなくて色々なサイトを巡りながら理解を深めているのですが実際何が分からなのか分からない状態です。
初心者向きのサイトを参考にせず入門書を1冊買った方が良いですか？
自分が今参考にしているサイトは

https://www.tohoho-web.com/js/
https://developer.mozilla.org/ja/docs/Learn/JavaScript

です。

2022/08/07(日) 10:56:23.83

>>978
「とほほ」は情報が古いのでやめたほうがいい
MDNはMozilla運営で一定の信頼性があるので、9割程度は信用していい(100%とは言わない)

MDNは入門向けコンテンツが少ないので入門書を買ったほうが勉強しやすいとは思う
買うなら外国人が著者の翻訳本をお勧めする
日本人が著者の本を何冊か持ってるが、信頼性が低い本が大半といわざるを得ない
オライリーとか一定の文量がある書籍がいいと思う

2022/08/07(日) 10:59:45.46

>>979
レスありがとうございます。
外国人が書いた翻訳本買って勉強してみます。

2022/08/07(日) 11:19:44.72

でもその日本語訳の信頼性はどうなのじゃ？

2022/08/07(日) 11:24:56.82

何度もすいません。
甘え承知で教えて頂きたいのですが具体的におすすめの本ありますか？
自分は業務(組み込み系)でC/C++言語をやってました。