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

**Name_Not_Found** · 2018/10/02(火) 21:20:04.46

【アフィ】元宇宙人のスピリチュアルブログ【詐欺】
https://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q12193781232

**Name_Not_Found** · 2021/01/22(金) 14:36:11.61

**Name_Not_Found** · 2021/02/18(木) 16:55:01.06

今javascriptとnode.jsを勉強してるんですがこの2つだけじゃ身につけにくいプログラミング言語の特徴みたいなのありますか？
型とかポインタ？とかかなと思うんですが

**Name_Not_Found** · 2021/04/27(火) 08:13:41.48

>>1
+ JavaScript の質問用スレッド vol.141 +
https://mevius.5ch.net/test/read.cgi/hp/1559474974/

**Name_Not_Found** · 2021/04/29(木) 11:20:02.03

本スレはこっちに移動しました

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

**Name_Not_Found** · 2021/04/29(木) 11:21:47.39

>>644
移動してないよ

**Name_Not_Found** · 2021/04/29(木) 11:44:05.43

古すぎるスレを再利用するな無能
昔は賑わってたから分散を防ぐために１つ１つ潰していく必要があったし
それが美学だったが、もう死んでるスレを掘り起こす意味は無いだろ
さっさと新しく作れ

**Name_Not_Found** · 2021/04/29(木) 12:15:52.87

>>646
別に死んでないよ
君はこのスレが使われると何か都合が悪いの？

**Name_Not_Found** · 2021/04/29(木) 12:30:01.29

立てるべきと思うなら立てりゃいい
前スレも再利用だしなんで今更言い出すのか知らんけど

**Name_Not_Found** · 2021/04/29(木) 12:41:32.35

馬鹿か
１つ、２つ前のスレならまだしも
2014年に建てられたスレをわざわざ掘り起こして再利用するヤツが居るかよ
テンプレだって腐ってんじゃねーか
ここに初めて質問した人にテンプレをまず確認しろという
超超超基本的なことも言えないだろ
下痢カス野郎

**Name_Not_Found** · 2021/04/29(木) 12:48:48.95

いや立てりゃいいじゃん
前スレ1000行く前に立てりゃ良かったのに

**Name_Not_Found** · 2021/04/29(木) 14:22:42.34

天才か
そりゃお前の言う通りだよ
オマケに次スレに案内したというところは超評価してるんだよ
でも案内先が地獄じゃねーかって文句一点だろ
いい加減理解しろよトンカチ頭

**Name_Not_Found** · 2021/04/29(木) 14:26:08.42

いやここで愚痴る間に立てりゃいいじゃん
誰も禁止してない

**Name_Not_Found** · 2021/04/29(木) 15:47:01.68

NO
俺は建てない
お前は国に不満があったら国を作るのか？
この親不孝者め！

**Name_Not_Found** · 2021/06/06(日) 01:19:25.65

Chromeブラウザの機能拡張についてはここで大丈夫でしょうか
自作の機能拡張を作りました。
ローカルから機能拡張をあててローカルに保存されたhtmlに対してだとエラーがでないのですが
ストアに登録して機能拡張あててローカルに保存されたhtmlだとエラーがでます。
manifestは
"permissions": [
"activeTab",
],
です。これだけだと足りないみたいなので"file://*/"を足そうと思うのですが
この対策で妥当ですか？

エラーは
lastError: Cannot access contents of the page. Extension manifest must request permission to access the respective host.
です

よろしくお願いします

**Name_Not_Found** · 2021/06/10(木) 01:14:17.45

自己解決
"file://*/"の追加はいらない。機能拡張の設定からファイルへのアクセスを許可をONにするでいけました。
ローカルでの機能拡張の場合はデフォルトでＯＮになってる。

**Name_Not_Found** · 2021/06/12(土) 08:16:12.41

jsで配列等の初期値は未定義ですか？
配列作成後、各要素にどのような値が入っているか仕様上の保証はありますか？

**Name_Not_Found** · 2021/06/12(土) 09:15:32.60

あ、やっぱりいいです

**Name_Not_Found** · 2021/06/12(土) 10:50:43.79

JSで初期値があるのは宣言された変数のみ
たとえ長さ100のArrayを作ったところで
実際に空の箱が１００個用意されるという仕様はない
ただlengthが100に設定された配列オブジェクトができるだけ
それぞれの要素に初期値などは設定されない
オブジェクトの未定義のプロパティにアクセスするとundefinedが帰るという仕様はある
ただしそれはundefinedが入っていることとはベつ

**Name_Not_Found** · 2021/06/21(月) 01:24:09.81

簡単なアプリを作ったんですがiphoneのみ画像やアイコンが表示されません
windowsやlinuxの色々なブラウザでは問題無しです
よくある原因は何になりますか？

**Name_Not_Found** · 2021/06/23(水) 06:28:14.29

iPhoneのSafariはmanifest.jsonまだ対応してないの？（クソデカため息）
>>659
これ使え
https://github.com/GoogleChromeLabs/pwacompat

**Name_Not_Found** · 2021/06/24(木) 00:36:30.85

【環境】Firefox 89.0.2, Chrome 91.0.4472.114
【何をしたのか】具材の一部を選択した後、フォームをリセットする
【エラーメッセージ】なし（input.curryのindeterminateプロパティがtrueのままになる）
【期待する結果】全てのチェックボックスのcheckedプロパティとindeterminateプロパティがfalseになる
【サンプルコード】https://jsfiddle.net/rhyutmL8/

**Name_Not_Found** · 2021/06/24(木) 01:57:47.41

リセットボタンクリック時に関数実行してクリアすればよくね？

**659** · 2021/06/30(水) 05:33:19.39

>>660
遅くなりましたがありがとうございます！

**Name_Not_Found** · 2021/07/03(土) 23:36:16.44

>> 661
formのresetイベントでindeterminateをfalseにすればええんちゃう

**Name_Not_Found** · 2021/07/08(木) 19:19:50.57

既出でしたらすみません。
slice()やcharAt()などの文字列メソッドの用途があまり想像できません…。
業務や趣味で使用したことある方いましたらどのように使用したのか教えていただけますでしょうか。

**Name_Not_Found** · 2021/07/08(木) 19:55:29.27

https://searchfox.org/mozilla-central/search?q=.slice%28&;path=
https://searchfox.org/mozilla-central/search?q=.charAt%28&;path=

**Name_Not_Found** · 2021/07/08(木) 23:18:56.24

パース処理するとき使うよ

**Name_Not_Found** · 2021/07/09(金) 01:13:27.56

Ruby でも同じだけど、文字列処理で使う

**Name_Not_Found** · 2021/07/09(金) 21:57:45.16

料金シミュレーションができるサイトで、
リストを選択すると金額がかわるものがあります。

ソースを見ると
<select name="item">
<option data-price="1000" value="1">商品名</option>

のような感じになっており、
選択するとJavascriptでdata-priceの値を取得して
金額を計算する形が多いのですが、
こういう仕組みってセキュリティ的に問題ないのでしょうか？

外部からの送信で金額が書き換わるとか・・・

**Name_Not_Found** · 2021/07/09(金) 22:22:41.95

>>669
書き換えた結果を誰が見るのかな？

**Name_Not_Found** · 2021/07/09(金) 22:35:34.36

>>670
安く買いたい人が金額を書き換えるとか、そういう問題起きないですかね？
フォームに金額を設定するタイプの仕様って危険な香りがして・・・

**Name_Not_Found** · 2021/07/09(金) 23:00:20.44

>>671
常識的には実際に登録する時にサーバはバリデートする
でないとクルーザー100円で買ったよ！なんて事になるから

**Name_Not_Found** · 2021/07/09(金) 23:47:15.96

自分が書き換えて、自分が見るだけなら、間違っても問題ない。
単に、その人の入力ミスだから

一方、サーバーのデータを書き換えて、大勢の人が見るなら、ヤバイ

サーバー側でもエラーチェックするけど、
例えば、千円を100円に間違ったため、多くの申し込みがあったとかは防げない

サーバー管理者にとって、100円がエラーとは分からないから

**Name_Not_Found** · 2021/07/09(金) 23:52:28.68

よく起こるのは、通貨・株式取引で、1桁間違ったとか

こういうのは商取引でも、プロの取引に認定されているから、間違った人が悪い。
取引を錯誤などで、キャンセルできない。
取引が絶対に確定される

一方、一般消費者の取引では、錯誤でキャンセルできる。
一般消費者は取引のプロではないから

**Name_Not_Found** · 2021/07/10(土) 03:22:04.94

>>671
フォームでsubmitされるのはvalue=“1”のほうであってdata-priceじゃない
確認画面では正しい金額で表示される

確認画面の金額もローカルで変更してから
OKボタンを押したところで支払う金額が変更後のものに変わるわけじゃない

**Name_Not_Found** · 2021/07/10(土) 09:35:58.56

シミュレーションの値段変えて何がしたいの？

**Name_Not_Found** · 2021/07/10(土) 10:16:22.71

>>671
できるかどうかの前に
故意に書き換えて購入しようとしたら犯罪ちゃうの？という素朴な疑問

**Name_Not_Found** · 2021/07/10(土) 11:37:33.72

671です。実際に登録が完了する前にバリデーションしたら問題ない
ってのは分かった上で、表面上の金額が変わることに問題ないのか？
という疑問が起きました。
故意に変えたら犯罪ではありますが、
そういう仕様になっているのは設計する側のミスでもあるので。

とりあえず、「操作している人が金額を変えられたとしても
決済時に金額が代わらないなら問題ない」
という解釈をし、HTMLに金額を書いても問題ないと理解しておきます。

**Name_Not_Found** · 2021/07/10(土) 11:51:27.44

スーパーの値札なんて簡単に入替できるけど
店舗設計者のミスなの？

**Name_Not_Found** · 2021/07/10(土) 12:05:19.54

カスタムデータ属性で何ができるのか調べればいいのに…
目の付け所が糞過ぎて凄い勉強効率悪そう

**Name_Not_Found** · 2021/07/10(土) 12:16:07.44

HTMLに金額書かずにどうやって客に金額を提示するんだよw

**Name_Not_Found** · 2021/07/10(土) 12:48:42.90

書き換えられると困るので、このスーパーではレジのみにて金額の確認をさせていただいております
どうかよろしくご理解ください

**Name_Not_Found** · 2021/07/10(土) 13:46:06.72

>>681
optionにはidだけ記載して、Ajaxで金額を称号して計算すると思ってました
でも、これならいちいちDBにアクセスするため、効率悪いですよね

**Name_Not_Found** · 2021/07/10(土) 14:52:15.79

>>683
ajaxで金額を照合して計算したとしても
計算結果の金額をユーザーに提示する必要があるよね

それは何らかの形でHTMLに書かれるわけだから
data-priceに金額を書いてるのと同じで書き換えが可能

**Name_Not_Found** · 2021/07/10(土) 16:58:48.39

>>684
非同期通信のデータも書き換えることができるんですね
出来ないと思ってました。HTMLに書くわけではないですから。

**Name_Not_Found** · 2021/07/10(土) 18:05:23.78

もう何言ってるんだかって感じ・・・
とりあえずHTTPの基礎を学んで出直してくれ

**Name_Not_Found** · 2021/07/10(土) 18:36:29.65

非同期通信とかを知っていて、なんでそんな思考になるのか理解できない
どんな順番で学んだのかな？

**Name_Not_Found** · 2021/07/10(土) 18:43:06.10

逆です。「もし自分が知らなかったら大変なことになる」と思っての質問です。
完璧に全ての要件を理解しているわけではないので、
自分が知らないことでセキュリティリスクが発生してはいけないと思い、
イレギュラーな質問をした次第です。問題ないのならそれが一番です。

**Name_Not_Found** · 2021/07/10(土) 18:43:40.11

非同期通信のデータも書き換えることができるけど
そうじゃなくてサーバーから受け取ったデータを元にHTMLを更新しないとユーザーは金額見れないじゃん

**Name_Not_Found** · 2021/07/10(土) 19:23:04.57

頓珍漢な考え方がリスクですわ

**Name_Not_Found** · 2021/07/10(土) 21:30:23.47

HTTP理解してない人間がWebアプリ開発に関わるというのが一番のリスク
Webアプリを開発するなら徳丸本レベルのセキュリティ知識は必須

**Name_Not_Found** · 2021/07/11(日) 02:55:05.08

CSRFトークンやらは流石にチームリーダーかベテランが設計して、レビューするのでは？

**Name_Not_Found** · 2021/07/11(日) 08:51:57.44

CSRFトークンとかはフレームワークが用意してる仕組みを使えよ

**Name_Not_Found** · 2021/07/11(日) 21:26:02.13

Ruby on Rails では最初から、

CSRF・Cross Site Request Forgeries 対策されている

**Name_Not_Found** · 2021/07/11(日) 22:22:40.00

ルビ基地はこんなところまで出張してくるのかよw

**Name_Not_Found** · 2021/07/12(月) 00:29:51.71

>>694
ルビ基地さん、マルチポストは禁止ですか？

**Name_Not_Found** · 2021/07/12(月) 22:07:17.75

Web上で動く動画編集ソフトを作っていて、メモリの使用状況を知りたいのですが、
navigator.onmemorypressureがクソ使えません。
タブが落ちるまで発動しないことや、落ちる寸前で発動してどうしようもないときがしばしばあります。
今は代わりにWeakRefを使ってCGの粒度と頻度を監視してメモリの逼迫を予測しているのですが
いつまでも実装内部の微妙な振る舞いに頼った方法を使うわけにもいかないので
もっと良い解決方法はありませんでしょうか？

**Name_Not_Found** · 2021/07/20(火) 11:11:13.43

超初心者です。
今やっている教材で
if(!$('#text').val()){
といった条件式のif文が出てきたのですが
これはなにをもってtrueなのでしょうか……

textは文字を１行入力するinput要素につけられたidだと思います

**Name_Not_Found** · 2021/07/20(火) 13:47:53.58

その要素のvalue属性がfalsyなら条件式がtrue
(!が否定なので)

文字列が空だったりしたらtrueになる

**Name_Not_Found** · 2021/07/21(水) 01:17:28.04

まず、!$('#text').val()、これは、!( $('#text').val() ) と同じ。
.val() は、<input>の内容を取得するので、文字列型

!文字列型は、文字列を否定した真偽値になる。
さらに、その真偽値を否定すると、!!文字列型。肯定に戻る

文字列の真偽値は、空文字列なら偽。
それ以外は真と判定される

だから下の出力は、文字列が存在すれば「あいう true false」、
空文字列なら「false true」

<label>入力文字列<input type="text" id="Text1" value="あいう" autofocus></label><br>
<button id="Button1">押して</button>
<p>出力 : </p><div id="output"></div>

$( "#Button1" ).click( function ( ) {
inputText = $( "#Text1" ).val( ) // 取得
console.log( inputText, !!inputText, !inputText )

$( "#output" ).text( `${ inputText } ${ !!inputText } ${ !inputText }` ); // 設定
} )

**Name_Not_Found** · 2021/07/21(水) 18:21:52.33

下記のような処理を行いたいのですが、「httpresponseに反応し、関数を呼び出す」の実装方法がわかりません。何か方法はありませんでしょうか。初学者の質問で恐縮です。

ページを表示→入力フォームに文字列を入力後送信ボタンをクリック→関数が呼び出され、httpresponseを返す→httpresponseに反応し、関数を呼び出す

**Name_Not_Found** · 2021/07/21(水) 20:32:21.67

jQuery on を使う。
よく知らないけど、素のJavaScript なら、addEventListener かな？

$('button').on('click', function(){
console.log('on');
});

Ajax 通信かな？
Promise, async/await とか

1. クライアント側から、サーバーへ送信する
2. サーバーで処理して、クライアントへ返信する
3. クライアントで受信して、処理する

**702** · 2021/07/21(水) 20:52:51.87

昔は、Ajax に、jQuery を使っていたけど、
最近は、axios を使う

「ajax axios 違い」で検索して！

**701** · 2021/07/22(木) 20:18:00.61

ありがとうございます！

**Name_Not_Found** · 2021/07/25(日) 13:46:41.67

通信技術板なのかもしれないんだけど、サイト閲覧や掲示板利用でIMEIって抜かれる（抜ける）ものなのかな？

IMEIのチェックサイトでも自動取得ではなく入力しろとなっているから、特殊なアプリでもなければ無理だよな思うんだけど
JavaScriptでも端末情報の取得までがマックスだよね、ちょっと自信ないので教えてください

セキュリティ板でモバイル板行けと言われたんだけどモバイル板も板違いっぽくて、ここに辿り着きました

**Name_Not_Found** · 2021/07/25(日) 16:34:23.00

ヘッダにつけて出して叩かれてたからdocomo以外は出さないと思ってたが、今はしらん
https://anond.hatelabo.jp/20111019232107
iphoneって付けるってホント？

**Name_Not_Found** · 2021/07/25(日) 16:59:19.64

>>706
こんなのあったんだ、ありがとう

iPadのWiFi利用だからそこまでは分からないんだけど
ドコモのそれも勘弁してくれだなあw
こんな簡単に抜かれて偽装だのされたらかなわない

**Name_Not_Found** · 2021/07/25(日) 23:08:42.11

>>705
「imei macアドレス違い」で検索して

IMEI は知らないけど、
端末固有のMACアドレスなら、同一LAN 内で、端末を識別するために使うだけ。
LAN外のWAN・インターネットには、その情報を渡さない

もし外へも渡すのなら、それをユーザー自らが許可しないといけない

**Name_Not_Found** · 2021/07/25(日) 23:48:09.30

UUIDが簡単に取れたのは昔々の話
iPhoneだとiOS6とかその時代

**Name_Not_Found** · 2021/07/26(月) 01:20:17.16

>>708-709
ありがとう、さらに調べてみました
やはり警戒したいのはIMEIなんだけどWEB経由では取得出来ず、
アプリなら技術的には取得可能ということのよう
もっともAppleもGoogleも基本的にはアプリでの取得も認めてない模様
現段階では、これで間違いないような気がする（素人判断）

**Name_Not_Found** · 2021/07/27(火) 22:37:24.54

このような場合でccc関数でaaa()を呼ぶにはどうしたらいいんですか？

function main{
　　　function aaa(){

　　　}
　　　function bbb(){

　　　}
}

function ccc(){
//ここでaaa()を呼びたい
}

**Name_Not_Found** · 2021/07/27(火) 22:56:34.80

訂正：function mainではなくfunction main()です

**Name_Not_Found** · 2021/07/27(火) 23:10:08.49

aaa を外出しにするか、main をインスタンスにしてaaaメソッドを呼ぶくらい
main内のスコープだよ内部変数と同じ

**Name_Not_Found** · 2021/07/28(水) 21:05:25.27

ABEMAのサイトなんですが
その中で遷移する場合、普通に遷移するのではなく、
unloadせずにjsでいろいろして遷移しているように見えます。
(例えばhttps://abema.tv/now-on-air/news-plus から右のチャンネル一覧を出して別のチャンネルに移動する場合
Consoleにはリンク先URLに移動しましたなどのログがありませんがアドレスバーはちゃんとかわっています
戻るを右クリックして履歴を出してもちゃんと履歴はあります)
jsで読み込んでDOM操作すればページ自体は行けるのはわかるのですが
URLや履歴はなぜ遷移なしに変更できるかわかりません。
document.URLなどに移動先アドレスを代入すれば普通に遷移してしまうと思います。
これはどのようにして実現しているのでしょうか？

**Name_Not_Found** · 2021/07/28(水) 21:19:26.45

>>714
History API
https://developer.mozilla.org/ja/docs/Web/API/History_API/Working_with_the_History_API

**Name_Not_Found** · 2021/07/28(水) 21:19:47.79

javascript アドレスバー書き換え

**Name_Not_Found** · 2021/07/28(水) 21:23:36.11

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

**Name_Not_Found** · 2021/07/28(水) 21:31:20.19

chrome系の場合遷移したのにその前の履歴が残らないのはあまりよろしくないということで結構前のバージョンからreplaceStateでもpushStateと同じ動作なので注意

**Name_Not_Found** · 2021/07/30(金) 05:56:08.20

その理由はおかしくないか？
303とかと同じで戻られたらよろしくないこともあるでしょ

**Name_Not_Found** · 2021/07/30(金) 20:50:34.74

サムネをクリックするとページ移動しないでその場で拡大画像を表示させるには
jqueryやライブラリ使わないで自力でjavascriptコード書くのは難しいですか？
そんなに手間かからないならjavascriptだとどう書けばいいんですか？

**Name_Not_Found** · 2021/07/30(金) 21:17:53.36

absoluteなdivをオブジェクトとして作っておいて
imgにclickのaddEventListenerでdivオブジェクトの中のimgのsrcをclickもとのsrcから引っ張ってきて
bodyあたりにappendChildしたらいいんじゃないかな

**Name_Not_Found** · 2021/07/30(金) 21:20:03.39

>>720
全然難しくない
そういう処理をしてるサイトでクリックイベントのコードを見れば解決

**Name_Not_Found** · 2021/07/30(金) 21:21:54.90

>>721
ajaxでデータ取ってくるイメージだと思うので
プログレスインジケーターとかもろもろの処理が普通は必要

**Name_Not_Found** · 2021/07/31(土) 12:43:13.40

例えば、jQuery のhover で、画像サイズを大きくするアニメなら、

<img src="a.jpg" id="img_01">

$( function ( ) {

$( "#img_01" ).hover ( function ( ) {
$( this ).stop( ).animate(
{ width: '600' }, 1000 );
}, ( function ( ) {
$( this ).stop( ).animate(
{ width: '300' }, 1000 );
} )
)

} );

**Name_Not_Found** · 2021/07/31(土) 13:45:44.53

サムネをそのまま拡大されてもなぁww

**724** · 2021/07/31(土) 14:38:27.43

例えば、jQuery で、
ボタンをクリックすると、画像を追加する

<div id="div_1"></div>
<button id="btn_1">押して</button>

$( function ( ) {

$( '#btn_1' ).on( 'click', function( ) {
// 要素の下に、要素を追加する
$( "#div_1" ).after('<img src="b.jpg">');
} )

} );

**Name_Not_Found** · 2021/07/31(土) 15:01:57.32

>>720
モーダル　自作　とかでぐぐれ

**Name_Not_Found** · 2021/07/31(土) 16:40:10.05

>>725
サムネならワンチャン transform の scale でいけますか？
いけますんね…

**Name_Not_Found** · 2021/07/31(土) 16:50:19.76

できなくはないだろうけどやる意味がない
サイズ云々じゃなくてクリック対象と拡大表示される画像はさすがに別のDOMじゃないとださい
画像自体はでかい画像のほうをcssで縮小してサムネにしておくとかなら同じオブジェクトのコピーでもいいけど

**Name_Not_Found** · 2021/08/01(日) 00:47:34.25

Lazy Loadみたいにimgタグに属性として実寸画像データのアドレス入れておいて差し替えたらいいんじゃないの？

**Name_Not_Found** · 2021/08/01(日) 21:06:55.05

Googleフォトに登録してAPIを使えばいい
サムネイルのサイズから拡大のエフェクトまで端末の種類に応じていい感じにしてくれる

**Name_Not_Found** · 2021/08/04(水) 19:01:58.76

てすと

**Name_Not_Found** · 2021/08/04(水) 19:06:41.91

wakuの高さを取得したくてこれでやっても600にならずに1800と表示されてしまいます。
どうしてでしょうか？たぶんoverflowで隠れた画像の高さも含めてる？
どうすれば高さの600を取得できますか？

<style>
#waku{
width:90%;
height:600px;
overflow:hidden;
}
</style>

<div id="waku">
<ul>
<li><img src="test1.png"></li>
...
<li><img src="test5.png"></li>
</ul>
</div>

<スクリプト>
var element = document.getElementByID("waku");
var element_style = getComputedStyle(element);
var property_value = element_style.getPropertyValue("height");
property_value = parseInt(property_value);

alert(property_value);

</スクリプト>

**７３３** · 2021/08/04(水) 22:02:16.81

display:table-cellを消したらちゃんと取得できました

**Name_Not_Found** · 2021/08/07(土) 12:53:08.80

element.onclick = func1;

func1(str){
alert(str);
}

この場合func1に引数を渡すにはどうすればいいんですか？

element.onclick = func1("aaa");ってやってもできなかった

**Name_Not_Found** · 2021/08/07(土) 15:17:25.81

部分適用
- 関数を返す関数に引数を渡す
- 返す関数は外側の関数の引数をキャプチャする(クロージャ)

function func1(str) {
return function(e) {
alert(str);
}
}

element.onclick = func1("aaa");

**Name_Not_Found** · 2021/08/07(土) 15:21:12.49

アロー関数使えばもう少し簡単に書ける
がCloudflareに弾かれたのでググってくれ

**Name_Not_Found** · 2021/08/07(土) 16:37:18.71

俺も弾かれた

**Name_Not_Found** · 2021/08/07(土) 21:44:05.47

ユーザーjsの使用用途で質問です。

webページで出てきたダイアログボックス（window.confirmで出力している様子）に対し
3秒後に自動で「OK」を押し（もしくはキーボードのEnter）てダイアログを閉じるにはどのように書いたら良いでしょうか・・？

使用環境
Chromeの拡張プラグインで「Tampermonkey」というユーザーjsのプラグインで使用

宜しくお願いします。

**739** · 2021/08/07(土) 23:05:16.71

すいません用途や環境はあまり考えなくて大丈夫です。

普通にjsでダイアログを閉じる記述を教えてください。。

**Name_Not_Found** · 2021/08/07(土) 23:41:27.15

comfirmやalertをスクリプトで閉じることはできないです

**Name_Not_Found** · 2021/08/08(日) 00:03:53.19

con

**Name_Not_Found** · 2021/08/08(日) 01:04:35.61

>>741
なるほど・・そうだったのですね
ありがとうございます

**Name_Not_Found** · 2021/08/09(月) 15:46:32.65

ユーザー操作が必要なのか

Selenium Webdriver で、ブラウザを自動操作すれば出来るのかな？

**Name_Not_Found** · 2021/08/09(月) 16:35:09.27

できないよ

**Name_Not_Found** · 2021/08/09(月) 17:16:41.55

できるよ

**Name_Not_Found** · 2021/08/09(月) 17:49:01.07

できるんやな

**Name_Not_Found** · 2021/08/09(月) 20:14:19.71

できるんやないな

**Name_Not_Found** · 2021/08/10(火) 13:53:21.83

jQuery のモーダルダイアログでは、

fadeIn( )で表示して、fadeOut( ) で非表示にするとか、
remove( ) で、モーダル要素を削除する

単に、jQueryで書いてるだけ

**Name_Not_Found** · 2021/08/11(水) 00:02:48.47

comfirmのダイアログにidが無い場合、
SeleniumでもjQueryでもcomfirmのダイアログを指定するには何オブジェクトなのでしょうか・・？
windowでイケます・・？

**Name_Not_Found** · 2021/08/11(水) 00:43:45.87

>>750
https://www.selenium.dev/ja/documentation/webdriver/js_alerts_prompts_and_confirmations/

**Name_Not_Found** · 2021/08/11(水) 10:52:26.99

id, class, タグ名などを組み合わせて、特定できないの？

**Name_Not_Found** · 2021/08/11(水) 15:37:59.62

>>752
無理のようですね。ダイアログが表示されている時はF12でソースすら確認出来ない状態ですし
confirmするのにidもclassもHTMLも不要ですし、、

**Name_Not_Found** · 2021/08/12(木) 00:47:58.26

<ul id="img_set" style="display:flex">
<li><img src="test1.png"></li>
.
.
<li><img src="test5.png"></li>
</ul>
このような横並びの画像があったとしてその幅を取得したいけど
chromeだとgetpropertyでulのwidthを取得できたけどIE11だと
ちゃんとした幅が取得できませんでした。
どうすればIEでもちゃんとした幅が取得できますか？

**Name_Not_Found** · 2021/08/12(木) 00:51:12.41

釣れるかな？

**Name_Not_Found** · 2021/08/12(木) 08:28:31.44

>>755
釣りじゃないよ
chromeとedgeはwidth2000だったけど
IEだと1000くらいだった

**Name_Not_Found** · 2021/08/12(木) 11:23:44.53

さすがにもうIEをフォローするのは止めちゃってもいいんじゃないかな

**Name_Not_Found** · 2021/08/12(木) 11:40:30.00

？？？「社のえらい人がIE使いなので対応してください」
？？？「官公庁です。根幹システムがIEのみなので従ってください」

これが日本

**Name_Not_Found** · 2021/08/12(木) 12:17:13.81

そういう人はここには来ない

**Name_Not_Found** · 2021/08/14(土) 00:06:22.37

// 表形式で出力
// https://developer.mozilla.org/ja/docs/Web/API/console/table
console.table({a: 1, b: 2, c: 3})

**Name_Not_Found** · 2021/08/16(月) 00:10:17.57

**Name_Not_Found** · 2021/08/16(月) 02:52:21.51

一つ目のループの最後にappendChildを入れてみるとか
document.body.appendChild(iimg_obj_list[n-1]);

**Name_Not_Found** · 2021/08/16(月) 03:18:06.79

>>761
どのタイミングでload eventが発生するのか考えたら？

**Name_Not_Found** · 2021/08/16(月) 08:06:13.76

>>761
読込完了前にalert出してるから0個で正解
雑に対応するなら時間差を付ける
setTimeout(function(){
var msg = img_load_count + "個の画像を読み込みました。";
alert(msg);
},3000);

**Name_Not_Found** · 2021/08/16(月) 12:47:43.04

Promise化してPromise.allで待つ

**Name_Not_Found** · 2021/08/17(火) 12:42:11.34

>>761
最後のalertを全ての画像を読み終わったときにしたいなら
onloadの関数内でlengthとcountを見て最後だったらalert出す
にしたらいいんじゃないかな

**Name_Not_Found** · 2021/08/18(水) 13:33:32.55

Promise.all で良いのでは？

**Name_Not_Found** · 2021/08/23(月) 03:40:06.83

今djangoメインでウェブアプリを作ってるんですが、どこまでの計算処理をjavascriptに任せてどこからをバックエンドのpythonで処理すべきかよくわかりません。

できる限りブラウザ側に計算処理させた方がいいと思うので出来る限りjavascripjで処理するようにするという基本思想で間違ってないでしょうか？

ほんとにバックエンドサーバー側で必要な処理だけをpythonで書くというのであってますか？

**Name_Not_Found** · 2021/08/23(月) 04:41:21.50

Ruby on Rails の基本は、HTML をサーバーで作って返す。
JSON を返す、API モードもある。
さらに最近は、GraphQL もある

個人の起業用には、Rails, Bootstrap を使う。
または、それにReact も加える

YouTube で有名な、雑食系エンジニア・KENTA のサロンでは、
さらに、Vue.js, TypeScript も加える。
これは大企業用

**Name_Not_Found** · 2021/08/23(月) 09:37:49.47

>>768
採用してるアーキテクチャとメンテナンス性やUXを考慮した役割分担方針によるので
一概にできるだけブラウザ側で処理したほうがいいというわけでもない

APIサーバーじゃなくDjangoのテンプレートエンジンつかってViewを返してるんなら
明らかにUXが向上する箇所だけクライアント側で処理するという方針も十分ありえる

**Name_Not_Found** · 2021/08/23(月) 12:04:41.00

>>768
お節介だとは思うけど数字を誤魔化されるとマズいアプリだと計算はサーバ側で必要な処理になるからね＞ゲームとかショップとかバリデートしなきゃならない
一言で「必要な処理」と言ってもアプリそれぞれだから注意しといてね

**Name_Not_Found** · 2021/08/25(水) 17:38:24.41

webに関してなんですが
greasemonkeyで本来宣言されていない変数名を定義すると
web管理側が対策をしようとすればわかっちゃうものなんでしょうか
var test;
ほにゃらら処理行
test = undefined;
としておけばわからないのでしょうか
Firefoxのコンソールで見ると宣言前に
test で ReferenceError: test is not defined と表示され
test = undefined;後にtest を入力すると undefined と表示されます。
未宣言か未定義かの違いだと思うんですが
これの区別ってjsでできますか？
また使った変数を未宣言の状態に戻すことは可能でしょうか？

**Name_Not_Found** · 2021/08/25(水) 18:20:51.22

基本見えないし自分が管理者ならそんな無駄な努力はしない
あと余所に見せたくないなら基本let,constで宣言すべき

**Name_Not_Found** · 2021/08/25(水) 18:52:04.35

グリモンは全体を無名関数でくるめばサイト側から見えなくなるという話はどうなんでしょうか

**Name_Not_Found** · 2021/08/25(水) 19:13:32.43

ありがとうございます
とあるサイトに
if(typeof(emergecy_xxx_brake_flg) !== undefined && emergecy_xxx_brake_flg == true){ ぬけあな }
みたいなコードを見つけかつ
emergecy_xxx_brake_flg をみると未定義でしたので
greasemonkeyでぬけあなを見つからないように使おうかなと思った次第です
あとでundefinedを入れておけば見つからないようですね

**Name_Not_Found** · 2021/08/25(水) 19:26:19.06

ユーザースクリプトは無名関数で囲む書き方が一般的だけど
しなくても主要なユーザースクリプト拡張は
ページ側の変数や関数名とバッティングさせない、GM API等のために関数でラップされて注入されてるのでページ側のスクリプトからは見えない

**Name_Not_Found** · 2021/08/25(水) 19:28:31.43

ということはemergecy_xxx_brake_flgをgreasemonkeyで定義しても元のscriptからは見えないし
ぬけあなを利用できないってことか
ありがとうございます

**Name_Not_Found** · 2021/08/25(水) 19:36:12.89

ゲームのデバッグ用フラグっぽい雰囲気だけど
オンラインゲームなら変数定義云々関係なくチート行為はいずれバレるぞ

**Name_Not_Found** · 2021/08/25(水) 19:46:45.57

広義のチートかもしれませんがフラグが立ってると
google IMA の動画広告を見ないで特定のページに行けるようになります
(postでパラメータを渡していてURLは同じなのでURL入力では飛べない。そのフラグでもIMAのあとのルーチンでも読んでる関数は同じ。)

**Name_Not_Found** · 2021/08/25(水) 22:22:25.60

本来宣言されてない変数名が存在するかどうかなんてチェックしないよ
チート対策はもっと違うアプローチでやる

ユーザー数の少ないゲームだとチート対策にかけられる予算も少ないから
よほどナイーブなやり方じゃなければ検出されない

**Name_Not_Found** · 2021/08/26(木) 01:41:30.42

もうチートだけ続くんじゃ

**Name_Not_Found** · 2021/08/26(木) 09:09:45.78

それはアクセス解析で簡単に検出されるパターンな気がするな

まあYoutubeでも広告見ないでコンテンツだけ見るのも普通にできるから
検出されても対処されるかどうかは運営次第

**Name_Not_Found** · 2021/08/26(木) 13:22:24.12

広告見ないでコンテンツだけ見る方法のがむしろ知りたいｗ

**Name_Not_Found** · 2021/08/26(木) 21:57:31.25

ublock Originみたいなアドブロッカー使う
詳細はググってくれ

**Name_Not_Found** · 2021/08/26(木) 22:13:09.83

ES2015 以降は、var は使わない。
var は、バグるだけ

let, const の時代

Webpack, Babel。
Ruby on Rails でも、そう

**Name_Not_Found** · 2021/08/27(金) 18:21:16.16

<input type="text" id="aaa" onkeyDown="test()">

function test(){
var str = document.getElementById("aaa").value;
alert(str);
}

このようにやって
入力した文字列を表示したいんだけど１つ前に入力した文字列が表示されてしまいます
どうすれば入力した文字を表示できますか？

**Name_Not_Found** · 2021/08/27(金) 18:44:33.19

oninput

**Name_Not_Found** · 2021/08/28(土) 14:12:13.59

jQueryの質問です。
各タグ内から数字テキストのみを抜き出して、それらを数値として合算（足し算）し、
その合計値をテキストで出力したいのですが、どのように書いたら良いでしょうか？

<div>hoge1</div>
<div>hoge2</div>
<div>hoge3</div>

→「6」と出力したいです。

宜しくお願いします(>_<)

**Name_Not_Found** · 2021/08/28(土) 16:37:35.57

vanillaで

Array.from(document.querySelectorAll('div'))
.map(x=>Number(x.innerText.match(/[0-9]+/)))
.reduce((acc, curr)=>acc+curr);

**Name_Not_Found** · 2021/08/28(土) 17:21:02.00

>>789
ありがとうございます！
でも
初心者すぎて結果の確認方法がわかりません・・・
cosole.log();やテキストなどでどうやって確認したらよいのでしょうか。。。

**790** · 2021/08/28(土) 17:26:41.82

すいません、変数宣言したらconsole.logで確認できました
>>789
ありがとうございます_(._.)_

jQueryでもわかる方いらっしゃると助かります。。
試したこと
.map() →文字列扱いされてしまい合計できない。

**Name_Not_Found** · 2021/08/28(土) 18:39:11.22

横からだけど勉強になります。
>>791
jQueryはしらないけどFirefoxで単純なサイトを開いてコンソールにそれを入れれば
いけましたね

**Name_Not_Found** · 2021/08/28(土) 19:43:44.73

>>791
配列とjQueryオブジェクトのmapは全く別物
let sum = 0;
$("div").each(function() { sum += Number($(this).text().match(/[0-9]+/)) });

**Name_Not_Found** · 2021/08/28(土) 20:29:35.08

>>793
ありがとうございます！
ただ、やはり結果の出力方法がわからないのですが、、

let sum = 0;
const total = $("div").each(function() { sum += Number($(this).text().match(/[0-9]+/)) });
console.log(total);
で
k.fn.init(3) [div, div, div, prevObject: k.fn.init(1)]
となってしまうのですが「6」と出力するためにはどのようにしたらよいのでしょうか・・初心者質問ですみません

**Name_Not_Found** · 2021/08/28(土) 20:32:15.32

totalはどこから出て来たんだよ
sumを出力しろ

**Name_Not_Found** · 2021/08/28(土) 20:35:25.05

>>795
ぬお！できました。　　　お恥ずかしい。。
ありがとうございます！！！！

**Name_Not_Found** · 2021/08/28(土) 20:47:59.34

加算代入 (+=)なんてものがあるとは・・・

**Name_Not_Found** · 2021/08/28(土) 21:22:19.02

割って掛ける除乗算演算子と
掛けて割る乗除算演算子もあるぞ
a = 4 /* 2;
a = 4 */ 2;
console.log(a);
//=> 4

**Name_Not_Found** · 2021/08/28(土) 21:33:12.98

Ruby など、たいていの言語に、複合代入演算子がある

**Name_Not_Found** · 2021/08/28(土) 23:32:57.67

ありがたいスレです(>_<)

**Name_Not_Found** · 2021/08/29(日) 04:18:28.46

>>798

**Name_Not_Found** · 2021/09/03(金) 21:02:01.45

ここでの質問なのかわからないですが
アナリティクスなどで、訪問者のiPhoneのバージョンがわかるようにしたり、集計ってできますか？
例えばiPhone12が○○アクセス、全体シェア○○％のように

**Name_Not_Found** · 2021/09/03(金) 21:34:48.91

**Name_Not_Found** · 2021/09/03(金) 21:44:48.13

const $el = document.getElementById('hoge');
let func = () => {
console.log($el);
}
setInterval('func()',1000);

としたところ、$elはnullになってしまいます。

let func = () => {
const $el = document.getElementById('hoge');
console.log($el);
}
setInterval('func()',1000);

とすれば$elには値が入りますが、setIntervalを実行する度にconstをセットするのが
どうもスマートでないように思います

JSの作法的に正しくて、スマートに書こうと思ったら
どう改善したら良いでしょうか？

**Name_Not_Found** · 2021/09/03(金) 21:48:29.24

>>803
ｱﾘｶﾞﾄｳｺﾞｻﾞｲﾏｽ!

**Name_Not_Found** · 2021/09/03(金) 21:56:16.09

>>804
setIntervalの気持ち悪い書き方を直すだけ
setInterval(func,1000);

**Name_Not_Found** · 2021/09/03(金) 22:07:25.41

スマートな書き方を聞くやつはスマートじゃないの法則

**Name_Not_Found** · 2021/09/03(金) 22:10:45.15

>>804
https://ja.javascript.info/onload-ondomcontentloaded

**Name_Not_Found** · 2021/09/07(火) 05:43:43.55

Firefox のコンソールで　0/-2　など　0を-xで割ると -0と出るのですが
プログラミングでは一般的なのでしょうか
0と出てきて欲しいんですが

**Name_Not_Found** · 2021/09/07(火) 06:06:08.37

>>809
一般的とは？そんなものはない
Object.is()で判定可能
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Object/is

**Name_Not_Found** · 2021/09/07(火) 07:50:22.49

>>809
>プログラミングでは一般的なのでしょうか

そこそこ一般的

**Name_Not_Found** · 2021/09/07(火) 09:51:01.19

ありがとうございます。
よく考えれば今回は-0でも問題ありませんでしたのでそのまま処理しました。

**Name_Not_Found** · 2021/09/10(金) 18:39:26.33

https://developer.mozilla.org/ja/docs/Web/JavaScript
完全な初心者向け
JavaScript ガイド
中級者向け
上級者向け
リファレンス
ツールとリソース

**Name_Not_Found** · 2021/09/13(月) 12:36:49.23

**Name_Not_Found** · 2021/09/13(月) 13:31:13.85

elm.list になってるからでは

**Name_Not_Found** · 2021/09/13(月) 13:53:56.57

>>815
elm_listでもできませんでした

**Name_Not_Found** · 2021/09/13(月) 14:28:45.90

ulに対してsepia(50%)設定してるのにliを0%にしたところで変わらんよ
見た目は子孫に影響するけど、プロパティ値は継承しないのでdisplayやopacityなんかと一緒で親の効果を上書きできるわけではないよ
#test li {
filter: sepia(50%);
}

**Name_Not_Found** · 2021/09/13(月) 18:38:27.91

スコープみたいなものですか？

**Name_Not_Found** · 2021/09/14(火) 07:50:54.02

>>817
なるほどー

**Name_Not_Found** · 2021/09/14(火) 13:43:26.00

特定の要素から特定のイベントのイベントリスナーを削除することは可能でしょうか？
関数への参照を保持していない状態です。

具体的にはwindow.addEventListener("storage",function(){～})の形で登録されているようなものです。
ピンポイントで上記だけ削除するのが難しいようであれば、window要素に紐づくstorageイベント全てを一括削除という形でも問題ないです。

**Name_Not_Found** · 2021/09/14(火) 19:34:00.52

chromeはできるかわからないけど
firefoxならublock originで
yahoo.co.jp##+js(aeld, storage,/functionの中身を正規表現で/)
でいけそうだけど

**Name_Not_Found** · 2021/09/14(火) 20:32:24.79

>>820
要素のイベントを全て削除
elm.replaceWith(elm.cloneNode(true))
windowはアキラメロン

**Name_Not_Found** · 2021/09/14(火) 22:56:39.52

イベント登録前に割り込めるならEventTarget.prototype.addEventListenerあたりをフックするとか

**Name_Not_Found** · 2021/09/15(水) 11:19:42.58

addEventListenerをフックするのが一番現実的なんですかね？

しかし、要素に紐づくイベントリスナーや、管理している全てのイベントリスナーを出力するみたいな関数は存在しないんですね……
ありそうなものだけど、というか無いならどこでどうやって管理してるんだろう……

**Name_Not_Found** · 2021/09/15(水) 12:22:46.44

>>824
普通は関数の参照をとっておく

**Name_Not_Found** · 2021/09/15(水) 12:45:18.50

>>825
自分で書く部分ならもちろんそうするんですが、Chromeの拡張で特定のページの邪魔な動作をシャットアウトしたいんですよね。

**Name_Not_Found** · 2021/09/15(水) 16:46:22.85

X軸方向のスクロールを常に禁止にし、常にスクロールをゼロの位置にする事って可能でしょうか？
cssでスクロールバーを出さない方法はありますが、要素が自由に動いてしまうのでスクロールしてしまう事が多々あります

**Name_Not_Found** · 2021/09/15(水) 17:55:31.30

>>822 に一票
クローンして差し替えることによりelmとその子孫のイベントリスナーが消え、その他の属性は残る

**Name_Not_Found** · 2021/09/15(水) 19:03:27.68

スクレイピングすると地獄へ落ちるって本当ですか？

**Name_Not_Found** · 2021/09/15(水) 19:21:25.96

>>826
キャプチャリングフェーズでstopPropagation

**Name_Not_Found** · 2021/09/16(木) 12:37:19.77

#test li{
background:#0000ff;
}
#test li:hover{
background:#00ff00;
}
というcssがある場合hoverのbackgroundを取得したいんだけど
querySelectorAll("#test li:hover")とやっても取得できませんでした。
どうやればいいんですか？

**Name_Not_Found** · 2021/09/16(木) 14:04:33.43

取得しようとした部分を書いて

**Name_Not_Found** · 2021/09/16(木) 14:47:41.06

:hoverはquerySelectorAllで取得できません
ちなみにgetComputedStyle(element, ":hover")もできない

**Name_Not_Found** · 2021/09/16(木) 15:15:39.66

どうやったらできるかを考えるのが、
あなたたちの仕事です

**Name_Not_Found** · 2021/09/16(木) 15:27:53.95

hoverのプロパティ自体を見たければstyleエレメントを見ればいいんじゃないかな
いまカーソルがのってるかを見たいなら
mouseoverイベントか対象にtransition入れておいてtransitionのイベントを見ればいいんじゃないかな

**Name_Not_Found** · 2021/09/16(木) 15:47:02.52

仕事と言われると対価が欲しくなる

**Name_Not_Found** · 2021/09/16(木) 18:11:46.09

>>832
<ul id="test">
<li>aaa</li>
<li>bbb</li>
</ul>
var element_list = document.querySelectorAll("#test li:hover");
var st = getComputedStyle(element_list[0]);
var val = st.getPropertyValue("background");
alert(val);

こうやっても取得できなかった
他に方法はないんですかね

**Name_Not_Found** · 2021/09/16(木) 18:30:00.02

>>837
document.styleSheets

**Name_Not_Found** · 2021/09/16(木) 18:36:24.59

クエリーセレクターにホバーは入れられないって言ってるだろ