+ JavaScript の質問用スレッド vol.129 + [無断転載禁止]©2ch.net
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。 >>2-6 のテンプレを読んだ上で質問してください。次スレは>>950 が>>2 のテンプレ案(本スレで改善案があれば考慮)を元に立ててください ■規則/推奨ルール ・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止) ・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。 ・質問テンプレートの利用推奨。 ・質問への「答え」だけでなく「意見」を出しても良い。 ■禁止行為 ・丸投げ質問 ・迷惑スクリプトの質問 ・オレオレ用語の使用(一般的な用語を使用する事) ・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事) ・回答者同士のレスは原則禁止(>>6 を参照) ・ライブラリの話題の投稿(>>6 を参照) ■質問テンプレート 【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4) 【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。 【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用) 【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。 【サンプルコード】現象を再現可能な最小限のコードを書いてください。 1レスに収まらないならコード投稿サイトを利用してください。 http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/ breakされるまで繰り返されるって事ですかありがとうございます >>106-107 そんなコードは窓から投げ捨ててしまえ 窓から投げ捨てるって久しぶりに見た もしかして2000年代半ばからずっと服役してたの? 今でも少女や赤ちゃんや犬が窓から投げ捨てられる事件が絶えないから 見ないって事は無いね >>110 ネットで流行る前からある表現だから、 ネットでの流行り廃りを基準にされても困る。 たぶんここが本スレだと信じて質問です。 Windows7-Pro ブラウザはFirefox50.1とChrome55.0 モニタリングシステム構築の予行としてPC内で周期的にダミーデータを発生させて、それを クライアント(Webブラウザ)で周期的に読み取って表示させたいです。 つまり本来の構成は、 測定装置(データ)→ PC[サーバー] → JavaScriptで読み取りブラウザ表示 なのですが、予行演習として PC[ダミーデータ生成] → JavaScriptで読み取りブラウザ表示 をしたいです。 データ生成と読み取りの周期は1秒か1分とかの間隔です。 このとき問題になると思ったのが、ファイル生成(上書き)の周期と読み取りの周期が タイミング的に重なった場合のバッティング(かち合い)で、回避策はありますでしょうか? ※要は書き込んでる最中やデータ更新中はブラウザが読み取るのを回避したい PHPは必要とあらば(基本レベルですが)使用可能です。バージョンは5.6.28です。 宜しくお願い致します。 ネットワークを介してタイミングを合わせるのはキビしいので サーバー側から能動的、定期的にデータを送信→ブラウザ側でイベント発生 の流れが無難かと Server-sent eventsかWebSocketsになるんかな >>115 普通にファイルにロックかければいいいよ 何もしていない普通の一般人の自宅に隠しカメラを取り付け それをネットでリアルタイム配信 仲間という人間に対する盗聴盗撮生ネット配信の会 しかけたカメラの映像 乗っ取っているPCの画像をリアルタイムで生配信中 集団で仲間の私生活を覗いて楽しんでいる そんなことが今この国では行われています 質問なのですが、アコーディオンで閉じるボタンをつけるには どういう方向にいじっていけばいいのでしょうか? これで開閉するようにはなったのですが、これの下に更に閉じるボタンをつけて それを押すと全体が閉じるようにしたいです。 <script type="text/javascript"> function layer_toggle(obj) { if (obj.style.display == 'none') obj.style.display = 'block'; else if (obj.style.display == 'block') obj.style.display = 'none'; } </script> <a href="#" onclick="layer_toggle(document.getElementById('more1’));return false;" class="open">クリック開閉</a> <div id="more1” style="display: none;"> 中身 </div> ✕閉じる (←ここに入れたい) JSDocで、「これはわざと未使用の関数ですよ(だから未使用っつー警告出すなよ)」 というのを宣言したいんだけど、どうしたらいいの? selectタグのリストを選んだ時にページの他の部分が書き換わるのってどうやって作ってると思う? selectタグの中にはonclickとかonchangeは書いてなかった イベントリスナーとかで何処かで登録してる感じなのか? jqueryは使ってたみたいだけどそのタグの部分はidとかnameはあったけどそのままの名前でつこうてるのはなかった 解析の定石みたいなのあったら教えて 環境はie11です > selectタグの中にはonclickとかonchangeは書いてなかった それが普通 >>123 ChromeかFirefoxを使え。jQueryで設定したイベントリスナーを 簡単に調べることができる。 Chrome http://qiita.com/zaru/items/b7732ebad9b732518359 補足 見る方法は変わってないが、今はjQueryで設定されたイベントリスナーを直接見れるようになってる Firefox https://developer.mozilla.org/ja/docs/Tools/Page_Inspector/How_to/Examine_event_listeners jQueryはよく使われているので、ブラウザが直接対応してくれてる。 もしこれが自分で作ったライブラリとかであれば、面倒なことになるだろう。 これもまたオレオレライブラリではなく、有名なライブラリを使ったほうがいい理由の一つ レスありがとうございます 閉じた環境なんでChromeとかはインスコとかは出来ないけど jsの飛んでるところを見つけれました jqueryのonchangeだったと思うけど onchangeとかを直接呼んでも動かなかったけど blur呼んだらイベントが反応しました やっぱブラウザとかは新しいのが欲しいですねぇ… >>116-117 さん有難うございます (すいません、本業が忙しくて返事できませんでした) 先ほどレスしようとしたのですが、Rock54のNGワードに引っ掛かりましたので、 別途テキストファイルでレス文をUpします。 http://uproda.2ch-library.com/9621868KS/lib962186.txt そういうときはNGっぽいものを変更すれば良いんだよ。 大抵はURLに問題がある Server-sent eventsは初めて見ましたので今勉強しています(なるほどプッシュ通知の一種か)。 WebSocketsはリアルタイム通信で使うとのことですが、この種のものに 「Milkcocoa」 https://mlkcca.com/ があるそうなのでこれも候補にしています。 ファイルロックを含め、また勉強してみます。 なお、基本的なところで、XMLHttpRequestを https://allabout.co.jp/gm/gc/24097/#2 と http://qiita.com/sirone/items/412b2a171dccb11e1bb6 を元に試しにテキスト読み込みJSを 作ったのですが、Firefoxだと問題無いのですが、GoogleChromeだとセキュリティの見地から ややこしいことになってますねw あと、XMLHttpRequestでテキストファイルでは http://anago.open 2ch.net/test/read.cgi/software/1339905697/317i のように xhr.responseType = "text"が必要でした(これが無いと「整形式になっていません」が出る) 以上、有難うございました。 この書き方では、aaaの直下のdiv だけが取得できますが、 var div_ary = document.querySelectorAll( "#aaa > div" ); こう書くと、aaaのすべての子孫の、divが取得されます var aaa = document.getElementById("aaa"); var div_ary = aaa.querySelectorAll("div"); element.querySelectorAll つまり、レシーバーがelement の書き方で、 レシーバーの直下のみを取得する、書き方はできますか? 【環境】Mac Chrome 【期待する結果】 <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> ・↑のような要素が連続して配列されている場合に、要素の3番目だけに要素を追加して <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“unko”>unko</div> <div class=“hoge”>hoge</div> という結果に出力したいんだけど、どうすればいいでしょうか…? 【サンプルコード】 //追加 var elmDiv = document.createElement('div’); //省略 var hoge = document.getElementsByClassName(‘hoge’); hoge[0].appendChild(elmDiv); ↑のhoge[0]の数字を3にしても3番目に追加できないんですが何か間違ってるんでしょうか・・・ >>130 ですが、 <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <スクリプト> スクリプトを書き出す場所を配列の下にするとうまくいくんですが、 <スクリプト> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> こういう形だとうまくいかないんですよね。。 後者の形で任意の配列への要素の追加はできないものなのでしょうか? >>130 【JavaScript】要素を追加するinsertBeforeとappendChildについて http://www.task-notes.com/entry/20161020/1476974565 配列のインデックスは、[0]から始まるから、3番目なら、配列[2]になる また、ソースコードには、半角しか使えない。 全角の「”’」などは使えない >>131 <div></div> <スクリプト> これなら、DOMが構築された後に、スクリプトが実行される。 <スクリプト> <div></div> これは、DOMが構築される前に、スクリプトが実行されるから、 スクリプト実行時には、<div>は存在しない DOMが構築された後に、処理を行う。 addEventListener とか HTMLの読み込みが完了してから実行 http://qiita.com/cervomansan/items/0873026853686503fc3a 初心者は、jQuery を使った方がよいかも 初心者ならなおのことjQueryじゃなくて普通のDOM使ったほうが良いだろ 簡単な命令だけを使って手続き型で書けばいいから 初心者にも理解しやすい jQueryだとリストで考えないといけないから慣れが必要 そういうのは開発コストを重要視するプロが使うもの 難しい反面、短いコードで記述できる jQueryで書いた場合 $('.hoge:nth-of-type(3)').before('<div class="unko">unko</div>'); または $('.hoge:nth-of-type(3)').before($('<div/>', {class: "unko", text: "unko"})); または $('<div/>', {class: "unko", text: "unko"}).insertBefore('.hoge:nth-of-type(3)'); Array.prototype.forEach()が使えるのは、IE9 からとか、 こんな事を一々、素人が気にしていられない 漏れはプログラマーだから、冗長になるけど、for ループを使っておくとか出来るけど、 素人には、jQuery の方が楽 insertAfter()は、jQueryにはあるけど、JSには無いとか、愕然とするやろ! insertBefore()だと、想定外の所に、要素が追加される >>129 それと、わかる人がいれば、お願いします。 これも、jQueryなら簡単 >>136 var div_ary = aaa.querySelectorAll(":scope > div"); >>133 回答のほどありがとうございます! window.onload = function () {}; で解決しました! 重ねて回答してくださった皆さんに感謝です! よかった〜 >>137 それってscoped cssってやつ? http://caniuse.com/#search=scoped なんか仕様から消えちゃったみたいだけど >>136 > Array.prototype.forEach()が使えるのは、IE9 からとか、 > こんな事を一々、素人が気にしていられない 気にしていられないの意味はなんかね? 動くかどうか気にしない。だから動かないこともあるってこと? プロは許されないけど、素人なら許されるでしょ 素人なら自分が使ってるブラウザの標準DOMとか JavaScriptだけでテストして動けばOK。 プロはそういう訳にはいかないからjQuery使うんだけど (自分で頑張って全てのブラウザでテストするっていうのは コスト意識がないのでプロ失格なので注意な) すみません、再度質問したいことがありまして。。 appnadChildのように要素を親要素の中に挿入するのではなく、要素の次に別のノードを追加する形にしたいのですが。。 親要素の中に追加要素を割り込ませるのではなく、純粋に指定した要素の次に追加要素を配置できるメソッドってあるんでしょうか <div></div> <div> <div>要素</div> </div> <div></div> という形ではなく、 <div></div> <div></div> <div>要素</div> <div></div> という形にすることってできますかね。。 insertBeforeの場合、 <div id=“hogege”> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> <div>追加</div> <div class=“hoge”>hoge</div> <div class=“hoge”>hoge</div> </div> と言うように包括する親要素が必要なんですよね。。 純粋に指定した要素の次に追加要素を配置できるメソッドがあればお教え頂きたいです。。orz 追加場所.parentNode.insertBefore(追加, 追加場所) これで追加場所の上に追加されるよ <html>以外は親要素が必ずあるから insertAfterみたいなことがやりたいなら referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling) bodyで包括されてるんだし、わざわざ新規に親要素を作る必要はないわな >>141 > 親要素の中に追加要素を割り込ませるのではなく、純粋に指定した要素の次に追加要素を配置できるメソッドってあるんでしょうか ない。DOMで用意されてるのは基本的な命令だけなので、 そのような特殊な条件の場合は自分でそういうコードを書かないといけない。 それが面倒だからjQueryがある。 結局、自分で関数を作っていくと、jQueryと同じものを作ることになる しかも、自分で作ったものは、jQueryよりも質が悪いから、 jQueryを使った方がよい、という結論になるw わかっててあえてやる車輪の再開発は楽しいし勉強になるけどな 仕事ではぐっとこらえないとあかん jQueryのように「セレクタで取ってきたリストに一括して処理する」という 関数型チックな設計で再開発するとjQueryがよくできてるのがわかるよね。 >>143 >>144 返信遅れてすみません やってみたらできました! 親要素ってなんでもいいんですね、勘違いしてました… 本当にありがとうございました! JavaScriptを学び始めて1週間程度の初心者です。<br> この春、集中的に学ぼうと思うのですが、何を中間目標にすべきなのでしょうか?<br> HTMLとCSSはそれなりに使えます。 jQuery, jQuery UI, jQuery Mobile http://itpro.nikkeibp.co.jp/atcl/idg/14/481709/030700305/?ST=cio-appli& ;P=2 > また、ECMAScript 2015仕様のJavaScriptには「let」ステートメントと「var」 > ステートメントの両方があるが、両方は必要ないとCrockford氏は述べた。 > varは関数レベルで変数を宣言し、letはブロックレベルで宣言する。 > Crockford氏は、varはJavaプログラマーを困惑させるとの理由から、letの方を好む。 > また、constステートメントを好む。constは、letと同様にブロックレベルだが、代入ができない。 babel使ったらすぐにconst使えるで var str = '"ttp://〜"'; テスト用文字列の中に、大量の「ttp://〜」がある時、 // がコメントに解釈されて困っています。 たぶん、/* があっても困るでしょう JSには、ヒアドキュメントも無いので、どうすれば? 別の文字に置換すると、テストにはならないし ファイルから読み込ませれば、良いのかな? でも、Edgeで出来ますか? >>158 自己レス。漏れの勘違いでした var str = '"ttp://〜"'; こう書いても、// はコメント扱いにはならなかった。 ちゃんと、変数に読み込めた 全くの初心者ですみません javascriptを始めたいのですが開発環境など調べてもわからないことが多く、 おすすめの開発環境を教えていただきたいのですが 個人的なおすすめはVSCodeだけど まずはメモ帳とブラウザで遊んで見ることから始めてみると良い ブラウザの開発者ツールを開きながら弄ってみて https://jsfiddle.net/9qLv6j66/ jsで巨大なデータを読み込むと停止したような状態になるけど、ブラウザによって変化するものなの? >>164 ブラウザによって変化するものではない あまりに巨大ならフレームこさえてその中で読むといい このスレは重複スレで本スレは「プログラム板」に移行したから人がいないよ >>164 はscript要素でhoge.jsを読み込んでいるのか、jsコード内でXHRやfetchを使ってデータを読み込んでいるのか(コードを書く)を書いて移行先で質問すると良いかと JavaScript の質問用スレッド vol.122 http://echo.2ch.net/test/read.cgi/tech/1472426483/ ありがとうございます。 jsでAjax型、PHP経由4096BITSの暗号化データを読み込んだあとに複合化を行いjson形式にもどしたいのだけれども。 暗号化データが96〜512ギガとあまりにも巨大で半分諦めています。 何か良い方法があれば良いのですが・・ だから、このスレには人がいないと言ってるんだけどね >96〜512ギガ こんな大きなデータは、無理だろ。 そもそも、メモリが4GBぐらいしかないから、スワップしてHDDに読み込むのか? >>168 4096Bitずつ読み出しながら変換かければ。 変換した後に何をするかよって対応が異なる。 特定のデータを探したいならデータを捨てればいいけど >>172 スライスで読み込むと途中で止まります。 読み込み、復号化、保存、をこまめにやろうが、処理後のデータを捨てようが開放しようがダメでした。 完全に詰んだ状態です。 さすがにjsじゃ無理だろ メモリ管理をほぼ自力で制御できる言語じゃないと無理っぽいが >>173 止まったところからやり直せばいいじゃん range指定して読み込め WEB+DB vol.97 の特集が、React WEB+DB vol.94 の特集が、Kotlin, Electron サイト内でCTRL+Cやメニュー等からコピーを選択したときに、それを常時監視して何をコピーしたのか把握をしたいと考えています。 コピーキーの発火タイミングやコントロール及びコピーされたものをAES等で暗号化してからAjaxでサーバーに吐き出す処理を行うことはjsだけで可能でしょうか? 把握したいだけなら選択状態に関するイベを監視してればよくね? >>175 >>172 ファイルはバイナリスライスで均等にチョン切ってから読み出し、ブロブやb64にしてゴニョゴニョすしてクリアできました。 あとは暗号化でBITSの高いものはjsだと負荷かかりすぎて現実的に難しいみたいです。 何か方法がないものか。 分割処理でローカルストレージみたいに一時的に保存するなら処理できるはず ただしjsで巨大なファイルを分割できても結合は不向きな PHPに渡してやるのが手っ取り早い importとかincludeみたいなのをかっこよく書きたい jqueryとか使えばかっこよく書ける? importとかincludeって、DOMと関係ないじゃないw かっこ良く書くのは良いけど、数行の記述でもJQ読み込ませるゆとりみたいにはなるなよ。 javascriptってオブジェクトを破棄(DELETE)する命令って無いよね? そのオブジェクトに関する参照を全て切っていくしか破棄の手段は無いって認識であってる? >>190 結局、変数の寿命をなるだけ短くしていくのが一番良いよね あれ、なかったっけ? 実際に破棄しているかどうかはともかく、明示的にプロパティを削除するメソッドがなかった? >>190 > そのオブジェクトに関する参照を全て切っていくしか破棄の手段は無いって認識であってる? つまり、そのオブジェクトを参照している人がいるのに、そのオブジェクトを削除したいってこと? >>192 プロパティを削除する命令はあるけど、KEYを削除するだけでVALUEの実態が削除されるわけじゃないね >>193 オブジェクトを明示的に削除することによって、それらを(別の箇所から)参照してたものにNullが入るような動作は無理なのかなと思って var a = 配列 ここで、a を使って処理する a = null; こういうように、null を代入しているような、ソースコードを見た事がない。 こう書いても書かなくても、たぶん、同じように処理されるのだろう つまり、書いた次の行では、解放されない。 関数(スコープ)を出た所以降で、解放されるのかも? まあ、そもそも実装の話だし、ソースコード・言語で、どうこう出来ない >>196 >null を代入しているような、ソースコードを見た事がない。 javaだと割としょっちゅう見たよねこれ懐かしい >>196 nullなりなんなりで参照を解かないとオブジェクトが削除されないじゃん 関数内での一次的なものでスコープ外れて自動的に参照もとろも無くなるケースばかりじゃないでしょ いや、そんなケースばかりだよ 例えば死なないクロージャがどんどんできていく状況なら 変数より先にそのクロージャをどうにかしないといけない グローバル変数に溜まっていくことも稀 大きなblobはnullを入れても明示的/暗黙的にblobURL化されていたりして リークして困ることが実際は多い >>194 オブジェクトを明示的に削除して参照が勝手にnullになるような言語ってどんなの? >>200 一言で言えばバグだよね? バグなら、バグの大本を修正すれば良いのでは? バグが有るんだからnullにした所で メモリリークを防げるだけで、 nullにアクセスした時点で落ちるでしょ fetchで取得したhtmlをxpathでいじりたくてDOMParserに渡したのですが どうも<img src=画像>とかを読み込んでみたいなんですけどこれを止める方法ってありますか? >>202 殆どの場合はメソッドを呼ぶ行為でリークするからnullにするとか関係ない それに別に仕様で決まっているわけでもないからバグとも言い切れない 改善に改善を重ねたDOMでは極一部の極端なケースで、 逆に参照が残ってるのに削除されるようなアルゴリズムが採用されてるしな 幾つもの言語や階層をまたがって、パフォーマンスも維持するためには完璧は不可能なんだよ >>205 意味がわからん。 参照が残ってるってことは メソッド呼び出しする可能性があるということだぞ お前のバグで、メソッド呼び出すことがないのだろうが、 お前のバグのことなんか言語は知らんってw ■ このスレッドは過去ログ倉庫に格納されています
read.cgi ver 07.5.5 2024/06/08 Walang Kapalit ★ | Donguri System Team 5ちゃんねる