[過去ログ] JavaScript の質問用スレッド vol.125 (1002レス)
上下前次1-新
抽出解除 レス栞 あぼーん
このスレッドは過去ログ倉庫に格納されています。
次スレ検索 歴削→次スレ 栞削→次スレ 過去ログメニュー
リロード規制です。10分ほどで解除するので、他のブラウザへ避難してください。
450(3): デフォルトの名無しさん (JP 0H11-JDfe [126.249.157.89]) [sage] 2022/12/22(木) 07:21:31.78 ID:slpViawnH(2/3) AAS
>>447すみません、訂正です
document.styleSheetで参照すると
document.styleSheet.cssRulesがnullとなってしまうんです
document.styleSheetで登録されるのは
同じファイル内のスタイルだけのよう?
他のcssファイルに書かれたスタイルを操作するには
どうしたらいいのでしょうか?
に訂正願います
455: デフォルトの名無しさん (JP 0H11-JDfe [126.249.157.89]) [sage] 2022/12/22(木) 19:14:24.29 ID:slpViawnH(3/3) AAS
みなさん、ありがとうございます。
関連した質問なのですが
cssが要素に適用される仕組みは
1:
<style>タグを読み込んだり<link ref>を読み込んだ時点で
ブラウザ実行環境にcssプロパティを記録して、セレクタを読み込んだ時に適用するのでしょうか?
それとも
2:
HTMLの要素を読み込んだ時に<style>タグや<link>先に走査して
cssの適用があるかを確認して適用する
なのでしょうか?
もし1なら、クライアントブラウザからアクセスできるような気がするのですけど
もし教えていただけるようでしたらご指導お願いします
457(2): デフォルトの名無しさん (JP 0H11-JDfe [126.249.157.89]) [sage] 2022/12/23(金) 07:08:17.10 ID:OG24yN7PH(1/5) AAS
>>452様
424,437,440,442の記載の通り、cssRuleを直接編集したいと考えています
>>451様
437,441,442で記載の通り、配列で受けとって編集することはできています
しかし別のスタイルシートでは同様の方法では参照できませんでした
>>445様のご指摘があって、再度検索してみたのですが
別スタイルシートのcssをオブジェクト化して参照する方法が見当たらず
今の質問に至っています
JQueryでできるようなレスがありましたので
JSでもできるのだろうなと思って次の質問をしました
皆様質問の仕方に失礼があっって申し訳ありませんでした
お許しくださいませ
462(1): デフォルトの名無しさん (JP 0H11-JDfe [126.249.157.89]) [sage] 2022/12/23(金) 19:30:29.91 ID:OG24yN7PH(2/5) AAS
>>458459,460,461
皆様ありがとうございます
具体的にこれをしたいというのはなかったんですけど
js勉強していまして、そういうことできるのかな?という質問でした
jsのエンジンは<link rel>を実行すると
jsの実行コンテキストを記録するメモリ部分に
<rel>の情報をロードして
HTML要素を読み込んだ時に参照するという挙動なら
クロスオリジンの適用を受けずに編集できるかなと
そういう疑問も持ちまして質問させていただきました
皆様ありがとうございました
464: デフォルトの名無しさん (JP 0H11-JDfe [126.249.157.89]) [sage] 2022/12/23(金) 20:55:49.05 ID:OG24yN7PH(3/5) AAS
>>460460(1): デフォルトの名無しさん (ワッチョイ 427c-e5AJ [43.235.241.201]) [sage] 2022/12/23(金) 17:28:12.54 ID:o+ONuUnd0(1/2) AAS
>>458で指摘している通り、他の所から読み込んだスタイルはそもそも変更出来ないって書いてあるんじゃね?
外部リンク:w3c.github.io
> Cross-origin stylesheets are not allowed to be read or changed.
>>459のように実際にcssRulesにアクセスすると自分の所のcssじゃない場合をアクセスしようとすると
Uncaught DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules
at <anonymous>:1:76
みたいなエラーになる
cssをいじりたいのだろうけど、そういう低層の話じゃなくて本当にやりたい事を書いた方が答えが得られると思うよ
結局何がやりたいのか全く分からんw
今勉強再開して思い出しました。
@keyframesのプロパティや値を
動的に変更したいと考えたのです
同じファイルなら
<style id="st">
として、stから@keyframesを設定編集できますが
外部ファイルでの設定編集ができないので
できたらいいな、って質問してみました
465(1): デフォルトの名無しさん (JP 0H11-JDfe [126.249.157.89]) [sage] 2022/12/23(金) 20:57:53.66 ID:OG24yN7PH(4/5) AAS
>>463勘違い、混乱してました。ありがとうございます!
467(1): デフォルトの名無しさん (JP 0H11-JDfe [126.249.157.89]) [sage] 2022/12/23(金) 21:19:54.48 ID:OG24yN7PH(5/5) AAS
>>466ローカルで、同じフォルダ内です
476: デフォルトの名無しさん (JP 0H88-aH43 [126.249.157.89]) [sage] 2022/12/25(日) 12:52:51.27 ID:GFtl9gAsH(1/5) AAS
皆さん、ありがとうございます
別シートのcssで可変にしたい部分を変数にし
読み込むシート側に変数専用のstyleタグを用意し
変数用のスタイルタグを編集することにしました
皆様いろいろとありがとうございました
478(2): デフォルトの名無しさん (JP 0H88-aH43 [126.249.157.89]) [sage] 2022/12/25(日) 13:37:10.68 ID:GFtl9gAsH(2/5) AAS
そうです
>>468様のアドバイスなら
私の学習レベルでもググり時間とられずにできそうだと思いまして
style.css
@keyframes xxx{ *** : var(--prm) }
index.html
<style id="prm"></style>
<script>
prm.innerHTML=":root {--prm:50% }"
のように、変数を編集するstyleタグを設けました
見栄え悪いしかっこ悪いんですけど
いろんな変数を設定変更する関数も自作できそうですので
とりあえずはこれでいいかなと
480: デフォルトの名無しさん (JP 0H88-aH43 [126.249.157.89]) [sage] 2022/12/25(日) 15:40:19.02 ID:GFtl9gAsH(3/5) AAS
>>479ありがとうございます!そうさせていただきます。
今後ともいろいろ教えてください。ありがとうござました!
482: デフォルトの名無しさん (JP 0H88-aH43 [126.249.157.89]) [sage] 2022/12/25(日) 16:50:28.05 ID:GFtl9gAsH(4/5) AAS
>>479様
面白かったです。
<html><head><body><div>
どの要素にでも、setProperty('param','value')を設定しておけば
別ファイルに作ったスタイルシートの変数を参照できるのですね
疑似的なコードですが
<script>
body.setProperty('--color','red')
div.setProperty('--color','blue')
html.setProperty('--color','green)
とすると、子孫のスタイル設定が優先されることも理解できました
とても面白く学習できました、ありがとうございました
483: デフォルトの名無しさん (JP 0H88-aH43 [126.249.157.89]) [sage] 2022/12/25(日) 16:51:23.54 ID:GFtl9gAsH(5/5) AAS
>>481ありがとうございます
次時間ができたときにぜひ調べて実行してみます
541(2): デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/05(木) 20:55:47.77 ID:XhDooIHVH(1/7) AAS
>>531531(6): デフォルトの名無しさん (ワッチョイ 8202-9yt5 [27.92.176.51]) [sage] 2023/01/05(木) 14:46:47.66 ID:EVXeoiyo0(7/10) AAS
すいません。やっぱり関数リテラルという意味を理解したい。。でも↓この質問でわかるかも。
だれか答えていただけますでしょうか?
---
次のコードがあります。1から5のうち
どれが適切でしょうか?
let dispMessage = function(msg){
console.log(msg);
};
1.
function(msg){console.log(msg);}
は関数リテラルである。
2.
dispMessage
は関数リテラルである。
3.
let dispMessage = function(msg){
console.log(msg);
};
が全体として関数リテラルである。
4.
全て関数リテラルとはいえない。
5.
関数リテラルとは、用法のことであり、
コード部分を表すものではない。
自分もあまりJS詳しくないんですけど
リテラルっていうのは、括るもの、という意味合いでは?
オブジェクトリテラルっていうのは波かっこで括るオブジェクト={}
文字列のリテラルは、""や’’
展開のリテラルは、``とか
関数のリテラルというのは、functionを指定した引数括弧つきのオブジェクトリテラルでfunction(){}
関数リテラルといえば、例えばfunction func(){...}
とした場合、{...}は変数funcに文字列として代入されます
そしてfuncは関数オブジェクトと指定されていて
関数の実行は()を読み込むことで実行されます
func 文字列
() 関数の実行
542: デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/05(木) 21:01:26.21 ID:XhDooIHVH(2/7) AAS
>>531
解決済みだったようですみませんでした
参考までに追加
function func(){return 1}
とした場合
console.log(func)
と
console.log(func())
を見比べるとわかりますが、
func変数の中身は、function指定された文字列で
func()は関数を実行した結果の1が表示されます
544(2): デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/05(木) 22:26:48.61 ID:XhDooIHVH(3/7) AAS
>>543括る、というのはそういう意味かと
リテラルはリテラルなので括る必要はなくて
プリミティブは、これは文字列です、
これは配列です、
これはオブジェクトです
とエンジンに理解させるための記述なのかと思いまして
547(1): デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/05(木) 22:57:51.54 ID:XhDooIHVH(4/7) AAS
括ることで、エンジンに対して、これは配列オブジェクトだよとか
これは{}だよとか、これは文字列だよとか、そういうことを伝えているってことですけど
550: デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/05(木) 23:12:56.82 ID:XhDooIHVH(5/7) AAS
<<538
諄いですね
正しい理論的な話あればご披露ください
JSの処理エンジンに、どういう記述があれば
どう処理するかというのがあるでしょ
{}とう記述を読めば、オブジェクトなのだな、と
””ならもじれるなのかなと、
function でて意義されたものがあれば関数なのかなと
リテラルは数値などの表現で
文字列は””、’’のクオーテーションで
関数は、function装飾委sで
それぞれが何を表現してるのかを確認し
スクリプト実行時にそれらをコンテキストに登録して
その後の作動を担保する、ってことなのかな
552: デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/05(木) 23:20:08.45 ID:XhDooIHVH(6/7) AAS
先生、ありがとうござす
時間とれましたら勉強してみます、ありがとうです
555: デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/05(木) 23:34:22.58 ID:XhDooIHVH(7/7) AAS
すみませんでした、もっと勉強します
559(2): デフォルトの名無しさん (JP 0H4f-ChaJ [126.249.157.89]) [sage] 2023/01/06(金) 22:25:41.09 ID:Th1PE0Z2H(1) AAS
リテラル
””や’’で表現されるのは文字列と評価する
[]は配列と評価する
{}はオブジェクトと評価する
JSエンジンがオブジェクトをどう評価して処理するかということだと思ったんですけど
何やら全く的外れなこと言ってたみたいですみませんでした
何度も謝ったのでもう許してください、鬼神様
561(1): デフォルトの名無しさん (JP 0Hd3-DWwd [126.249.157.89]) [sage] 2023/01/07(土) 08:36:35.89 ID:I26x6s3dH(1) AAS
時間があるときに読んでおきます
609: デフォルトの名無しさん (JP 0H67-w88e [126.249.157.89]) [sage] 2023/01/17(火) 19:01:55.76 ID:LBqNgpc6H(1) AAS
ポインタのこと?
613: デフォルトの名無しさん (JP 0H67-w88e [126.249.157.89]) [sage] 2023/01/18(水) 07:40:19.90 ID:Eqd2U92jH(1/2) AAS
documentのpropertyにconcertzenderって標準でないっしょ?
スクリプトのどっかでなんか設定してるん?
614(1): デフォルトの名無しさん (JP 0H67-w88e [126.249.157.89]) [sage] 2023/01/18(水) 07:41:25.64 ID:Eqd2U92jH(2/2) AAS
それとエラーの内容も書き込まずにして質問っていうのもどうなの?
622(2): デフォルトの名無しさん (JP 0H67-w88e [126.249.157.89]) [sage] 2023/01/19(木) 22:07:44.38 ID:40XBuhhWH(1) AAS
君は君の質問に反応しない人には
推し量って導こうという崇高な意識はないの?JS使いなのに?
上下前次1-新書関写板覧索設栞歴
スレ情報 赤レス抽出 画像レス抽出 歴の未読スレ AAサムネイル
ぬこの手 ぬこTOP 0.057s