X


+ JavaScript の質問用スレッド vol.123 + [無断転載禁止]©2ch.net

■ このスレッドは過去ログ倉庫に格納されています
2017/04/02(日) 23:30:38.56ID:Qcd0Qmy10
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.122 +
http://echo.2ch.net/test/read.cgi/tech/1472426483/
VIPQ2_EXTDAT: checked:vvvvvv:1000:512:----: EXT was configured
553デフォルトの名無しさん (ワッチョイ 6fcb-zjai [223.132.6.112])
垢版 |
2021/06/08(火) 11:33:50.39ID:V6KC1q9F0
オブジェクトリテラルはプロパティと同義ですかね?
オブジェクトの持つデータですよな
2021/06/08(火) 12:01:34.57ID:pZSU03Zb0
>>553
違う

あなたは先日からおかしな前提の質問ばかり
知識の穴が多すぎて一問一答で出来る範囲を超えている
YAGNI信じてるようだが、必要になったら基礎学習する習慣をつけるべき
2021/06/08(火) 12:26:14.97ID:Vw+6EMs10
> prototype=組み込み、といった意味だと思いますし、、、。


専門用語が分からない

そうだ英単語の意味から推測しよう

英単語の意味から間違えている

いくらなんでも酷すぎ
プログラミング関係なく問題解決の取り組み方が杜撰で稚拙すぎ
辞書引くことすら失敗するとか一体どういう教育受けてきたの
2021/06/08(火) 18:29:25.55ID:pZSU03Zb0
自分で調べるより専門家に聞いた方が早いと思うタイプの人なんだろう

>>555のようにちょっと調べればわかるはずの内容を質問したり、回答したURLを全く読んでないかのような反応が返ってくる
DOMもプロトタイプチェーンも学習した形跡がない
2021/06/08(火) 18:39:03.92ID:spIl1qf+M
忍耐強く付き合ってくれる方々が居るうちはYAGNIで上手く行くのかも知れない
早々に匙を投げてしまった自分が言える立場じゃないけど
2021/06/08(火) 21:06:17.76ID:6yn9zQdn0
オナニーメソッドは定義されてますが
セックスメソッドが見当たりません
559デフォルトの名無しさん (ワッチョイ 7fad-3tT5 [27.141.86.23])
垢版 |
2021/06/09(水) 11:50:43.35ID:+7j1Uic/0
C#の拡張メソッドはやってることが分かりやすいね
staticと宣言され、thisが第1引数
ただ宣言と利用で引数が違うのが気持ち悪い

C#で基礎的に多い使いどころはnull処理や型変換
なんでも型としてobjectがあるので
でもやたら型に煩いので中の分岐が面倒

javascriptの引数は全てなんでも型だが、逆にprototypeのthisだけは型が必要
なので、null処理や型変換は、普通の関数にしてる
そもそも「メソッドチェーンはnullで止まる」とか、最初から言われてたり
2021/06/09(水) 12:14:45.43ID:mxnL56NS0
>>559
> javascriptの引数は全てなんでも型だが、逆にprototypeのthisだけは型が必要

後半はちょっと意味がわからない

this値はStrictModeで指定値をそのまま使い、SloppyModeで指定値をObject型に変換した値を使う
型の制約はないはず
561デフォルトの名無しさん (ワッチョイ 7fad-3tT5 [27.141.86.23])
垢版 |
2021/06/09(水) 12:35:56.32ID:+7j1Uic/0
>>560
失礼、nullが駄目なだけだね
2021/06/09(水) 12:40:37.25ID:muvslTP60
オナホールに型があるとは知りませんでした
密閉型のつもりで射精したら貫通型だったらしくリークしてしまったようです
563デフォルトの名無しさん (ワッチョイ 6fcb-zjai [223.132.6.112])
垢版 |
2021/06/09(水) 13:01:14.82ID:+7DuCF3D0
arrayとDocument.createDocumentFragment()の違いってなんでしょうか?
createElementで作成したタグを、ターゲットに複数追加したい場合、後者を使います。
しかし、arrayにもアンカーは格納されているようです。
2021/06/09(水) 13:53:10.87ID:mxnL56NS0
>>561
nullでも問題はない
実証コードを書いて、問題が起きるパターンを整理してみては?
Object.prototype.toString.call(null)
2021/06/09(水) 13:54:10.75ID:mxnL56NS0
>>563
回答スルーして新規質問を量産してるが、何がしたいんだ?
2021/06/09(水) 14:01:43.46ID:w6w52mg40
createDocumentFragment は、jQuery でも使っている

ソースコード内を検索してみ
567デフォルトの名無しさん (ワッチョイ 7fad-3tT5 [27.141.86.23])
垢版 |
2021/06/09(水) 15:23:28.36ID:+7j1Uic/0
>>564
Object.prototype.foo=function(s){略}
null.foo() こう書けないなら

function foo(s){略}
foo(null) こうせざるを得ない、ということなんですが

null.foo().bar() この利点は
bar(foo(null)) これより目に優しいという
2021/06/09(水) 18:17:53.95ID:mxnL56NS0
>>567
いろいろと誤解があるので、プロパティアクセサ、プロトタイプチェーンについて再学習することをお勧めする
(ちなみに、あげられている問題は「this値」は全く関係していない。用語定義も見直したほうが良いと思う。)

Object.prototype.foo を定義してfooプロパティを参照できるのは、new Objectかプロトタイプチェーン上に Object.prototype が存在するオブジェクトに限定される
プロパティアクセスする際、それがPrimitive値であるなら、Object型に変換してプロパティ参照を試みるが、null, undefined はObject型に変換できず、TypeErrorとなる

(null).toString; // TypeError: Cannot read property 'toString' of null
(undefined).toString; // TypeError: Cannot read property 'toString' of undefined

なお、null,undefinedでなくても、プロトタイプチェーン上に Object.prototype が存在しなければ、Object.prototype.foo をプロパティアクセサで参照できない

Object.prototype.foo = 1;
console.log(Object.create(null).foo); // undefined

Object.prototypeの影響範囲は大きいが、それでも全てのデータに影響を及ぼすものではない
569デフォルトの名無しさん (ワッチョイ 7fad-3tT5 [27.141.86.23])
垢版 |
2021/06/10(木) 08:41:17.28ID:U1CAdJt50
>>568
だからnullは駄目ってことですよねw
(C#ではそれができるという違い)
2021/06/10(木) 08:57:10.02ID:O1fj45xU0
>>569
null.foo()が動かない背景の説明>>567,559が何一つ正しくなくて比較対象として成立していない、という話
2021/06/12(土) 12:09:15.43ID:TONJAMor0
JavaScriptは初心者向けの簡単な言語と言われているけど、ものすごく難しくないですか?
Javaとアセンブラも出来るけど、JavaScriptの方が圧倒的に難しい。
2021/06/12(土) 13:07:42.11ID:gwGFqR/Mr
当たり前だけど初級レベルはそれほどでもない
しかし製品レベルを作るとなると一気にナンジャコレ的な書き方でジャバパーたちには理解不能になる
そこにDOM、jsxやstyle componentとかも入ってくるからもはや宇宙語になる
2021/06/12(土) 13:10:20.75ID:sFAMwcrAM
まずJavaが出来るとはどこまで出来るのか
2021/06/12(土) 13:34:25.97ID:dSUYOhsd0
JavaScriptはWEBブラウザを誰でも持っていて環境が身近だから試してみやすいというだけで、言語自体が初心者向けというわけではないだろ。

まともに使おうとしたらかなり筋の悪い言語。所詮はWEB用のDSL。
Excelは持ってるからVBAやってみるみたいなもんだよ。
2021/06/12(土) 15:13:04.15ID:TONJAMor0
>>573
ボラクルのシルバー
2021/06/12(土) 15:55:52.61ID:uZPmX/A70
>>571
JavaScriptの理解が難しくなる下地は十分にある

- 複数の仕様書
- 複数ブラウザで動作確認
- 新機能作成時の制約(一定の後方互換性を担保)

それ以前にESレベルの基本を分かってない人が多過ぎな気はするが

- 型
- [[Prototype]]
- プロトタイプチェーン
- スコープチェーン
2021/06/12(土) 17:03:36.21ID:th+ACTev0
JavaScript(正しくはECMAScript)ほど仕様しっかりしてる言語は今メインストリームの言語でそんなにはないと思うけどな。Cはしっかりしてるけど、かなりコンパクトな言語だからドキュメント量が全然違う
RubyやPythonにいたっては酷いもんだ。思い付きで作ってるレベル
2021/06/12(土) 17:20:10.36ID:7X99TIl20
仕様が複数あると言っても、Babel使ってES2020から入るのが正解だろうね。
余計なことを学ぶ必要性が減る。プロトタイプチェーンなんて最初は知らなくていい。
2021/06/12(土) 17:33:15.15ID:oYBdY7Ja0
Babelで後方互換性担保できるといっても
Setみたいに色々なことができるせいで機械的な書き換えができないコンストラクターがあるからなあ
業務端末が古いandroidのイントラ案件でSet動いてないの気付かず3時間くらい無駄にしたわ
2021/06/12(土) 17:52:32.79ID:uZPmX/A70
JavaScript関連の仕様はECMAScriptの他に、DOM,HTML,UIEvents,fetch,Selectors,CSDOM等、多くの仕様がある
Babelを使えば、ECMAScriptをES2020に一本化出来るが、他の仕様は読まなければならない
仕様書の中には日本語訳がなく、英語を読まなければならない場合もある

対して、Ruby,Pythonは公式マニュアルの日本語訳一つを読めば事足りる

資料の読みこなしの面では、JavaScriptの難度は非常に高い
不正確な二次情報に惑わされたり、MDNも時々間違ってたり、罠が多い
2021/06/12(土) 18:08:20.99ID:7X99TIl20
DOMを扱うならDOMを学ばなきゃならんというだけでJavaScriptとは関係ないが?
RubyやPythonを使ったとしてもDOMを扱うなら同じように必要だろう。

Webだけで学ぼうとすると古い情報に惑わされやすいというのはその通りだな。
ちゃんとした書籍を1冊用意して学ぶのが吉。
2021/06/12(土) 19:05:50.66ID:uZPmX/A70
>>581
Python公式文書はDOM APIの説明があるので、DOM仕様書を読まずともある程度の情報は得られる
https://docs.python.org/ja/3/library/xml.dom.html

ESにはDOM,HTML,fetch,CSSOM等のAPI情報は当然ない
MDNがこの役割に近いが、仕様程の信頼性がなく、英語版と日本語版で情報に差異があったり、仕様と比べて情報鮮度が落ちている部分がある
体系的な一カ所にまとまった一次情報と呼べるものがJavaScriptにはない
実装が複数仕様を実装する形なので当然だが、調査コストが高いのは事実

Pythonは仕様と実装が同一なので、仕様と実装の差を区別する必要がない
ドキュメントも仕様と実装の2つ分を読む必要がなく、最新の情報に整備されている
2021/06/12(土) 19:38:43.59ID:7X99TIl20
糞どうでもいいさにしか思えないがそこまでして優劣をつけたいんだろうか
2021/06/12(土) 21:01:08.50ID:uZPmX/A70
>>583
ちゃぶ台返しだな
>>571>>581にいってやれ
2021/06/12(土) 21:06:47.07ID:7X99TIl20

DOMを持ち出すのは関係ないし糞どうでもいいことなのは変わらんが?
586デフォルトの名無しさん (ワッチョイ 1369-UeOY [114.171.63.103])
垢版 |
2021/06/15(火) 08:09:22.25ID:V8tE61t00
1個の商品の金額の場合オブジェクトでvar shouhin = {};と宣言してshouhin.kingakuとすればいいんですが
複数の商品の場合shouhin[1].kingaku、shouhin[2].kingakuのようにしたいんですが
宣言や関数で引数として渡す場合はどうすればいいですか?
587デフォルトの名無しさん (ワッチョイ 7361-42hD [218.33.253.212])
垢版 |
2021/06/15(火) 08:57:01.65ID:+pZThSMJ0
配列にするだけじゃん。
588デフォルトの名無しさん (ワッチョイ ffad-W6T4 [27.141.86.23])
垢版 |
2021/06/17(木) 11:44:35.91ID:Y2s/MWh/0
内部関数をコールバックに渡せるのは超楽だね
同名のグローバル関数があってそっち行くかな?と思ったらちゃんと内部関数に行った
(そもそも普通の関数に内部関数をほいほい書ける時点で超楽だが)

コールバックがグローバルに限定された言語の場合、名前管理が増えるのが嫌で、
なんとかコールバック使わずに、とか頭をひねっちゃう
2021/06/17(木) 12:31:17.20ID:hYDgxsHQ0
classを使ってる奴いる?
今まで通りfunctionのコンストラクタで十分だよな。
2021/06/17(木) 14:39:14.89ID:jYVCbF5R0
>>589
誰のためにあるかという話だわな。
なおクラス構文導入議論時、反対派の旗手だったのはグッドパーツ著者でありJSONの発明者でもあるダグラスクロックフォード。

https://www.graat.co.jp/blogs/ckn8ourdkezx50b95h4v5uk1o
障害物 #1: .NET開発者のチーム参加
概念実証の後は、クライアントのアウトソーシングチームの開発者が合流した。 知識共有はまだ始めておらず、CTOから「やあ、Răzvan。明日は本物のアウトソーシングチームと会わないといけないね」とメールが送られてきた。

我々はミーティングを設け、テクニカルリードは私を質問と解決策で迎え撃った:

「依存性の注入はどこですか?『必要ない』とはどういうことですか?」:これはInversifyJSだよ!
「関数コンポーネント? ダメダメダメ。我たちは好きじゃないからクラスコンポーネントを使いましょう!」
「なぜこれらの関数はただぶら下がっているだけなのですか? なぜ静的にするためサービスクラス内でカプセル化しないのですか?」
「APIのリトライポリシーはどこですか? PollyJSで実装しましょう」
「なぜクラス名がパスカルケースの場合にファイル名がダッシュケースとなるのですか? クラス名を反映させるため、今後はSomePageComponent.tsxという名前にします」
そして、私をもっとも悩ませた件:「Visual Studio CodeでなくVisual Studioで実行するにはどうすればよいでしょうか?」
私は確信した。彼らはReactで .NETのガイドラインとデザインパターンを使いたがっている。私は何度もこのような出来事を見てきた — 新しい技術のやり方に適応できず苦労している開発者だ。



9か月後、我々は50ページ以上を作成していた。開発者たちは関数コンポーネントがクラスコンポーネントと同じくらい良いことに気づき、それらを使い始めた。その結果、進行中のプロジェクトは元々のコーディング規約に従わなくなっていた。


本当.NET老害ってクソだわ。
自分が分からないからって意味ない(できることが増えるわけでもない)クラスベースに固執しといて、単純な関数で同じことできると気づいたらお前らのワガママに合わせて作ってやったコーディング規約破って勝手に使い出すんだからな。
いや、言いだしっぺなんだからクラス使い続けろや!
2021/06/17(木) 16:52:43.35ID:hYDgxsHQ0
>>590
結局これも将来的には非推奨になりそうですよね。
中途半端な機能を増やされると現場はかえってしんどい。
592デフォルトの名無しさん (ワッチョイ 1ecb-wcuM [223.132.6.112])
垢版 |
2021/06/20(日) 16:40:52.66ID:WIbUxISs0
要素を取得して、appendchildしたいのですが、appendchildは移動になるんですよね。
そこでassignでコピーしたいと思います。
以下のspanをコピーした後、別のspan内に入れたいです。

<span id="test_span" style="background-color: skyblue;">てすとな</span>
<ul id="table_of_content"></ul>

let toc = document.getElementById("table_of_content");
let span = document.getElementById("test_span");
let copy = Object.assign(document.createElement("span") ,span);
toc.appendChild(copy);
しかし、これだとtable_of_contentにspanは挿入されますが、spanの中身がありません。

let copy = Object.assign(document.createElement("span") ,textContent:span.textContent);
こうへんこうしてもだめです。
let copy = Object.assign(document.createElement("span") ,{textContent:span.textContent});

これならokです。
なぜこのような結果になるのでしょうか?

マージするオブジェクトの型?みたいなものが一致していないとだめなのですか?
1つ目はタグにタグをコピーしているだけ
2つ目はタグにプロパティをコピーしている
3つ目はタグオブジェクトに、オブジェクトリテラル?をコピーしている?

この辺のことを教えて下さい
2021/06/20(日) 20:46:26.62ID:sZ7GtS6K0
Nodeオブジェクトに元から存在するプロパティは列挙可能になってないからそのままObject.assginしても何もコピーされない
textContentプロパティだけを取り出してObject.assignするくらいなら
let copy = document.createElement("span");
copy.textContent = span.textContent;
でいいじゃない

もっともノードの複製は
let copy = span.cloneNode(true);
で一発。ただしid等の一意であるべき属性も存在する場合は複製されることに注意
594デフォルトの名無しさん (ワッチョイ 1ecb-wcuM [223.132.6.112])
垢版 |
2021/06/21(月) 11:08:34.75ID:qJrDRmsU0
>>593
ノード全体をコピーする場合はcloneで、タグ名などを変えたい場合は教えてもらった方法でやることにします。
1行目なんですが、「 Nodeオブジェクトに元から存在するプロパティは列挙可能になってないからそのままObject.assginしても何もコピーされない 」というのはどういう意味でしょうか?
1つめのやり方に対してだと思いますが、どちらのspanエレメントもtextContentプロパティは持っていると思います。

とりあえず、中身もコピーする場合はプロパティにまでアクセスしないといけないことは分かりました。
object.assignというのはループを回しているわけですよね。おそらく。
595デフォルトの名無しさん (ワッチョイ 9325-565v [106.184.154.198])
垢版 |
2021/06/21(月) 18:44:30.50ID:uOMSqfSW0
素のJS書いてます
DOM要素の中身をまるまる消したいんですが、もっといいやり方ないですか?
今はinnerHTML=""で消してます
2021/06/21(月) 23:17:22.43ID:K1IZmgnQM
それだと気に入らない点は?
2021/06/22(火) 01:04:49.78ID:kGm2q7jg0
var el = document.querySelector('#nakamikiero');
while (el.firstChild) el.removeChild(el.firstChild);

別にinnerHTMLでいいと思う
598デフォルトの名無しさん (ワッチョイ 8701-626F [126.84.19.55])
垢版 |
2021/06/22(火) 01:23:10.83ID:XaKTjWfC0?2BP(1000)

初心者です。
chrome拡張機能を作っているのですが、自分のコードが他の人から見たら、見づらかったりするのか気になったので評価してくれませんか?
一人で作っているのでコメントはほぼないです。
https://harigami.net/cd?hsh=b5c6452f-fa81-4b69-b554-d68bf8194d75
599デフォルトの名無しさん (ワッチョイ 9769-XViW [180.48.211.187])
垢版 |
2021/06/23(水) 17:45:18.28ID:XH4Ry57E0
constって値の変更できないのであとから値を変更したくなった場合letに書き直さないといけないので
最初からconstよりlet使った方が無難だよね?
constの方が速度が速いってこともないだろうし
2021/06/23(水) 18:05:46.06ID:9X5+Yxrt0
JITの最適化に影響することはあるんじゃない?知らんけど
個人プログラムならそう困ることないし別にいいと思う
2021/06/23(水) 18:16:29.13ID:uY7z/n/mM
letってスコープ外からアクセスできないのであとからアクセスしたくなった場合let消してグローバル変数にしないといけないので
最初からletよりグローバル変数使った方が無難だよね?
letの方が速度が速いってこともないだろうし
602デフォルトの名無しさん (ワッチョイ 9769-XViW [180.48.211.187])
垢版 |
2021/06/23(水) 18:20:16.91ID:XH4Ry57E0
>>601
グルーバルはどこからでも変更できちゃうので基本使わない
せやから変数はバケツリレーしてでも引数として渡す
2021/06/23(水) 20:29:20.42ID:XbDUStol0
>>602
それが分かるなら、「letはスコープ内で改変可能なので、再代入が必要な変数以外では使用しない」に辿り着くはずなんだがな
2021/06/23(水) 21:08:19.92ID:rlUBqderr
なんか新次元の考え方してるのがおるな
2021/06/23(水) 21:53:55.51ID:L1j5jH/CM
再代入が必要な変数が全体の何割あるかまず眺めてみたらいいんじゃね
更にあとから再代入の必要性に気付くパターンに絞って何割あるのか
2021/06/24(木) 21:15:11.64ID:hag/RBI30
>>602
>>601 がアイロニーだってことくらい気づけよ。
607デフォルトの名無しさん (ブーイモ MM2b-81U8 [163.49.202.31 [上級国民]])
垢版 |
2021/06/25(金) 16:01:35.51ID:CvkTX/L1M
DIVの中にline-hightを設定したテキストを入れた時と同じ場所になるようにDIVと同じサイズのCanvasの中に文字を書き込みたいんだけどどうやるの(´;Д;`)
2021/06/26(土) 17:26:43.66ID:JTIK8PSO0
>>607
ボックスモデルと同じ計算を実装すればいい
https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model
609デフォルトの名無しさん (ワッチョイ f535-ZvIq [220.208.234.203 [上級国民]])
垢版 |
2021/06/26(土) 18:57:01.42ID:JMJiYaB90
>>608
line-height内でのテキストの上下方向の位置を合わせる方法がわからない
2021/06/26(土) 19:10:04.18ID:JTIK8PSO0
>>609
border,line-height,paddongを計算すればいい
というか、ボックスモデルを読め
611デフォルトの名無しさん (ワッチョイ f535-ZvIq [220.208.234.203 [上級国民]])
垢版 |
2021/06/26(土) 19:52:17.54ID:JMJiYaB90
ボックスというかベースラインの話
今サンプル作る
2021/06/26(土) 20:25:23.61ID:JTIK8PSO0
>>611
ではvertical-alignを作れ
https://developer.mozilla.org/ja/docs/Web/CSS/vertical-align

当初のline-hightが関係なくなってる
現象を切り分けしてから質問してくれ
613デフォルトの名無しさん (ワッチョイ f535-ZvIq [220.208.234.203 [上級国民]])
垢版 |
2021/06/26(土) 20:30:25.16ID:JMJiYaB90
>>612
そのベースラインの座標がわからない
614デフォルトの名無しさん (ワッチョイ f535-ZvIq [220.208.234.203 [上級国民]])
垢版 |
2021/06/26(土) 20:35:43.90ID:JMJiYaB90
サンプルがこれなんだが、最後の 80*0.64 って奴がline-height*割合で
割合を調整してベースラインの位置に来るように調整してあるんだがfont-sizeやline-heightを変えると0.64じゃ一致しなくなる
https://codepen.io/as124680/pen/wvdwWyO
615デフォルトの名無しさん (ワッチョイ 4569-QOAx [180.48.211.187])
垢版 |
2021/07/12(月) 23:42:04.57ID:wbIA3J3A0
<table id="tb">
<tr>
<td><img src="./test1.png"></td>
<td><img src="./test.2png"></td>
<td><img src="./test3.png"></td>
</tr>
</table>

tableの中にあるimgのelementを取得したいんですけど
imgに個別にidやclassを設定しなくてもそれぞれのimgのelementを取得できる方法があったら
やりかたを教えてください
2021/07/13(火) 00:00:08.97ID:orpWKMoQM
>>615
document.querySelectorAll("#tb td > img");
セレクタの指定は適当なので目的に応じて考えてくれ
2021/07/13(火) 03:42:43.38ID:dtNqNBdW0
「css セレクタ」で検索!

x y は、xの子孫(子・孫・玄孫なども含む)のy。
x > y は、xの子(直下のみ)のy

JavaScript の質問は、web制作管理板の方へ書き込んでください!
この板のスレは、荒らしが出た時に、緊急避難用に立てられたもので、今は使われていません
618デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/18(日) 14:00:13.55ID:5EoIqaKx0
プログラミングするときは必要な処理を必ず日本語化したほうがいいですか?
まず、必要な機能をすべて書き出してから、フローチャート的なものを作る

ぶっつけでコードを書き始めると駄目ですかね。
2021/07/18(日) 14:03:11.59ID:V5WXwT7R0
いや全然
620デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/18(日) 16:06:28.09ID:5EoIqaKx0
ストップウォッチを作っています。
1:スタートボタンを押した時にカウントアップを開始し
2:もう1度押すと停止します
3:もう1度押すと途中からのカウントアップを開始します

この途中からのカウントアップのやり方がわからないのでヒントを教えて下さい。
addTime変数にカウントアップ途中の数値をセットし、3に加算すればいいわけですが、上手くイカなかったので教えて下さい。
わからないのはaddTimeの取得方法と、加算のタイミングです。
621デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/18(日) 16:08:02.80ID:5EoIqaKx0
https://ideone.com/Fq7ki3
コードはこちらになります。

別の質問なんですが、コードのペーストサービスってどこがいいんでしょうか?
2021/07/18(日) 16:09:17.45ID:EvgeERSZ0
一人で作る場合はそんなことしてる奴ほぼいないと思う
チームで作るならそれをするのはPMの仕事
2021/07/18(日) 18:28:56.11ID:V5WXwT7R0
>>621
ごめんコード見てない
https://jsfiddle.net/bLce9az3/
2021/07/18(日) 20:54:37.23ID:H/NN8O820
JSFiddle が多いかも。
Ideone とか

Codepad は、バージョンが古い感じ

日本なら、paiza.IO
625デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/18(日) 23:43:41.81ID:5EoIqaKx0
>>623
どうも
performanceを使うといいんすね

差分の部分も参考にさせてもらいす
わからなかったら聞きます
626デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/19(月) 14:43:39.83ID:Dj9cyoNJ0
jaavscriptって型あるんですか?
let ms= 1000
としてもデータオブジェクト?じゃないので、getUTCSeconds()などが使えません
let ms = new Date(1000)

これでokです

>>624動作確認しやすいのでjsfiddleにしときます
2021/07/19(月) 19:11:44.96ID:ailiffqUM
JSは動的型付け言語なので当然型はある
あと所詮60の除算をしてるだけなので、いちいちDate型に変換するのはぶっちゃけ大仰
628デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/19(月) 20:25:14.80ID:Dj9cyoNJ0
>>623
performance.nowって時刻を取得して差分を求めるより、正確なタイマーになるんでしょうか?
utcの時刻です。
2021/07/19(月) 21:04:01.22ID:xti7QTCXM
ブラウザ次第としか
最近は敢えて精度を落としてることもあって、多分変わらんかも
2021/07/19(月) 21:45:19.83ID:09ZI50XP0
>>621
k4aのコードに似てるのは気のせいか?https://teratail.com/questions/348862

>>628
同じ質問者が質問して得た回答に答えはある
https://teratail.com/questions/348048
631デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/20(火) 06:08:39.83ID:VV+336kW0
>>630
performanceについての質問はしてないですよ。
performanだとcpu性能などに影響されるのか分かりません。
2021/07/20(火) 06:28:13.06ID:znznH+MD0
>>631
失礼、performance.now()には触れてなかったな
だが、リファレンスに書いてある

https://developer.mozilla.org/ja/docs/Web/API/Performance/now
> performance.now() メソッドは、ミリ秒単位で計測された DOMHighResTimeStamp を返します。

---

https://teratail.com/questions/348048
> あらゆるイベントに timeStamp というプロパティがあり、これが 0.005ms 程度の精度だそうです。

こう回答されたら、俺ならtimeStampプロパティを使うが
633デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/20(火) 11:44:45.80ID:VV+336kW0
>>632
performanceはタイムスタンプを取得しているそうですが、その取得にはcpu性能が影響するのでしょうか。
最初のタイムスタンプの取得が遅れたとしても、終了時のタイムスタンプも同様に遅れるわけですから、差分は変わらないと考えればいいでしょうか。
2021/07/20(火) 18:05:59.91ID:2nw+devd0
>>633
CPUに影響しない処理はほとんどないも思うが、GPU演算を期待してるのか?
ハードウェアアクセラレーションは門外漢なので分からん
専門家に確認してくれ

そこまで気にしていて、requestAnimationFrameが候補に挙がらない理由が謎
2021/07/20(火) 19:59:06.20ID:VVNKYXKQM
質問の意図がよく分からないので何とも
完全無欠なタイマーが作りたいって話なら力にはなれん
636デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/20(火) 22:23:21.73ID:VV+336kW0
>>634
ありがとうございました。
gpuを期待しているわけではないです。
非力な環境で正確な動作をするかどうか分からないのです。
637デフォルトの名無しさん (ワッチョイ bbcb-Io+N [223.132.6.112])
垢版 |
2021/07/21(水) 21:55:42.60ID:eII+w+/h0
msから時間(hour)を取得する関数はあるのでしょうか?
getutchourとgethourだと、時刻?が取得されるみたいです。
http://www.htmq.com/js/date_getUTCHours.shtml

1日が86400000msなので、何時間か得るにはこうします
86400000 / 3600000 = 24

getutchoursを使用すると結果は0となります。

let dt = new Date(86400000);
console.log(dt.getUTCHours());
2021/07/21(水) 22:38:44.52ID:EEgQ3OP9M
ありません
2021/07/21(水) 22:45:53.25ID:EEgQ3OP9M
割り算すら面倒ならMoment.jsでも使ったら
2021/07/21(水) 23:23:26.06ID:DMdKV/rn0
>>637
剰余
641デフォルトの名無しさん (ワッチョイ 6340-kbnc [157.147.40.213])
垢版 |
2021/07/22(木) 01:35:46.57ID:pUylfiot0
最近javascriptを始めた者ですが、最初の段階からつまづいています。
参考にしているのはこの本ですが「https://www.sbcr.jp/product/4815601577/
ブラウザのコンソール機能を使って文字を表示させるのですが、上手くいきません。
「>console.log('おうむ返し');」と打ち込んでも、「Uncaught SyntaxError: expected expression, got '>'」
と言うエラーメッセージが出て上手く表示されません。
本に書いてある通りにやっているつもりなのですが、何故なんでしょうか?
宜しくお願いします。
642デフォルトの名無しさん (ワッチョイ 6301-zSg9 [221.24.92.174])
垢版 |
2021/07/22(木) 01:46:58.75ID:VUYJjhRP0
console.log('おうむ返し');
と打ち込んでください
2021/07/22(木) 01:47:21.36ID:QbcHd2I2r
エラーメッセージにそのまま書いてるだろ
なんで読まないんだよ
644デフォルトの名無しさん (ワッチョイ 6340-kbnc [157.147.40.213])
垢版 |
2021/07/22(木) 02:05:33.27ID:pUylfiot0
>>642
「illegal character U+FF1B」と出るのですが・・・
645デフォルトの名無しさん (ワッチョイ 6340-kbnc [157.147.40.213])
垢版 |
2021/07/22(木) 02:13:03.04ID:pUylfiot0
自己解決しました。
「:」を付けるなと言うエラーでした。
しかし、本には「>」「;」を付けろと書いてあるのですが
付けてはいけないのでしょうか?
2021/07/22(木) 03:43:27.82ID:kFdJ5CFB0
「javascript console.log」で検索してみれば?
2021/07/22(木) 03:43:40.04ID:ZZMUYXj4M
u+ff1bは全角のセミコロン(;)
;みたいな半角にすれば上手くいく
セミコロンに限らずプログラムを書く時は文字列、コメント以外は基本全角を使ってはいけないことを意識した方がいい
JavaScriptの場合文字列にあたるのは"文字列"、'文字列'、`文字列`の3種類
2021/07/22(木) 03:57:29.35ID:af5EgLY0M
言い忘れてたけど>はコンソールの入力を表してるだけだからそれ自体は入力しない
javascriptと直接は関係ないけど$とか#も同様
2021/07/23(金) 07:07:08.07ID:UhHw7gdf0
まああとエラー文くらいは英語でも読もうぜ
せっかくエラー出してくれてるんだから
650デフォルトの名無しさん (ワッチョイ 6ecb-qCnf [223.132.6.112])
垢版 |
2021/07/23(金) 14:12:58.59ID:/dxGnZSf0
都道府県のデータを地図上に表示させる場合、なにかしらapiを使いますか?
例えば、人口のデータ。
東京10万人、大阪5万人というデータだった場合、東京を赤に、大阪を青にします。

cssのareaとif文でできそうですが、グラフィカルに出来るやり方はあるんでしょうか?
2021/07/23(金) 16:25:33.46ID:Nx0yKcVz0
知らないけど、Google MAP と契約するのじゃないの?
652デフォルトの名無しさん (ワッチョイ 6ecb-qCnf [223.132.6.112])
垢版 |
2021/07/24(土) 05:34:58.11ID:rkiLuKXr0
>>651
googlemapほど高機能じゃなくてもいいんですよね。
単なるグラフ化するライブラリなりあれば

ただ、地図ですが
■ このスレッドは過去ログ倉庫に格納されています