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

■ このスレッドは過去ログ倉庫に格納されています
2021/11/10(水) 15:24:24.80ID:jxD2VXPG0
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
2021/12/11(土) 11:56:54.19ID:kTfvj9Ya0
>>156
うおーすげー天才
ありがとうございます!
158デフォルトの名無しさん (テテンテンテン MM6b-fD8e [133.106.48.27])
垢版 |
2021/12/12(日) 17:05:57.60ID:neOkkgxzM
var obj={
key:{x:200,y:300}
}
obj.key2=500;
alert(obj.key2);
alert(obj.key.x);
上はオブジェクトで下はオブジェクトのオブジェクトです。
実行結果は上が500で下が200です。
一応動作はしますがこのような使い方は間違っていますか?
2021/12/12(日) 18:15:54.15ID:vioicQgx0
>>158
「間違っている」は「期待する動作」によって決定される
それをあなた自身しか知らないので、第三者による判断は不可能
160デフォルトの名無しさん (ワッチョイ c910-BpYN [180.12.82.129])
垢版 |
2021/12/12(日) 18:40:13.36ID:MwcQtjtM0
>>159
文法的にはどうですか?
2021/12/12(日) 19:22:12.57ID:vioicQgx0
>>160
文法は他人に聞くまでもない
コンソールにSyntaxErrorが出力されていなければ、文法的に問題ない
2021/12/12(日) 20:06:45.86ID:A9cM/MPAM
何に引っかかってるのか書かないと期待してる答えは返ってこない
特に変なところないし
163デフォルトの名無しさん (ワッチョイ c910-BpYN [180.12.82.129])
垢版 |
2021/12/13(月) 08:42:46.82ID:8aJMJMAP0
引数が多い場合の引数の渡し方について
function(
aaa,
bbb,
ccc,
・・・(略)
zzz
){}
って書くより
function(obj){
var aaa = obj.aaa;
var bbb = obj.bbb;
・・・・・(略)
var zzz = obj.zzz;
}
って書く方がいいんでしょうか?
どっちもメリット、デメリットはあると思うけど
2021/12/13(月) 13:06:28.94ID:CRKwXgwv0
>>163
何でこう無条件に善し悪しを求めようとするかね
メリット、デメリットがあるなら、どちらが良いと決めつけることは出来ないと判断出来ないものなのか
2021/12/13(月) 15:27:20.29ID:+BabEBNV0
下のほうなら
const f = function({aaa, bbb, zzz}){
console.log(aaa, bbb, zzz);
}
のほうが分かりやすくないか
const o = {
aaa: 'あ',
bbb: 42,
zzz: 'ん',
};
f(o);
2021/12/13(月) 18:56:15.12ID:hdHWXJOsM
>>136
形だけひとまとめにしても後でバラすんじゃなんの意味もない
objとかじゃなくて意味のある名前が付けられる範囲でまとめるべき
2021/12/13(月) 18:56:54.87ID:hdHWXJOsM
>>166>>163あて
168デフォルトの名無しさん (テテンテンテン MM6b-fD8e [133.106.52.36])
垢版 |
2021/12/14(火) 13:31:35.06ID:qf3fX3jjM
var str="x^2 + (x+2)^2 - (x*(x-2))^3";
をMath.pow(x,2)+Math.pow((x+2),2)-
Math.pow((x*(x-2)),3)に置換するにはどうやればいいんですか?
2021/12/14(火) 15:01:16.14ID:82CERvuP0
Math.powを使わなければ簡単なんだけどね

eval(str.replace(/\^/g, '**'));
2021/12/14(火) 15:08:13.94ID:4lV7iDvz0
スペース含まない半角文字列限定。式の文字列つくるまで。
賢い人ならもうちょっとスマートに書けるかと。

var str="x^2+(x+2)^2-(x*(x-2))^3";
function func(s){
var s2=s.split('^');
var s3=s2[1].replace(/¥d+/,"");
return "Math.pow("+s2[0]+","+s2[1].replace(/[^¥d]/,"")+")"+s3;
}
var result=str.replace(/[a-z¥(¥)¥d¥*¥+¥-¥/]+¥^¥d+([¥+¥-¥*¥/]|$)/g,func);
171デフォルトの名無しさん (ワッチョイ c910-fD8e [180.12.82.129])
垢版 |
2021/12/14(火) 18:05:48.23ID:ZmdmxRFm0
>>169
そうやった方が簡単そうですね
>>170
ありがとうございます
2021/12/15(水) 19:13:45.77ID:h9C3pi7L0
いつもはreplaceやmatchを使うんだけど、
execってのがキャプチャグループだけを簡単に抜き出せて便利そうだから使ってみました

txt="AabBxxB";

pattern = /A(.*)B/;

d=pattern.exec(txt);

alert(d[1]);



期待する結果はab

でも実際はabBxxが返ってきます、後方参照ってやつですか?一番後ろのものとマッチしてしまう
これって最短距離でのマッチを取得するにはどうすれば良いんでしょうか?
2021/12/15(水) 19:19:59.60ID:UjbkuvW00
.*?
2021/12/15(水) 19:20:26.59ID:LAChl8N10
ぱっとしかみてないけど
pattern = /A(.*?)B/;
2021/12/15(水) 19:22:08.15ID:Z/edc8620
A([^B]*)B
2021/12/15(水) 20:16:03.92ID:1LHweqXF0
( ^)o(^ )b
2021/12/15(水) 20:34:33.03ID:h9C3pi7L0
>>173
>>174,175
ありがとうございます
なるほど、*も+も?も単体で使うと最長一致になるけど
*?とか+?みたいに組み合わせて使うと最短一致になるんですね、ややこしい…
2021/12/16(木) 20:22:00.71ID:bW+aVaO40
>>177
その通りだが、一文字ならバックトラックが発生しない最長一致がいいと思う >>175
2021/12/22(水) 17:33:35.08ID:ONJh0jXva
【環境】Windows 7 64bit, IE11
【何をしたのか】
$("form")で取得している内容が自分の考えと正しいかを確認したい
1. alert($("form")) → [object Object]と表示される
2. alert(JSON.stringify($("form"))) → IEが動作を停止しましたで強制終了
【エラーメッセージ】-
【期待する結果】
$("form")の中身が確認したいです
手段は選びません
console.log()は試していませんがshowModalDialogにて新規で開かれるウィンドウが描画されるまでに行われる処理のようで、コンソールを開く前に終わってしまうためalertで今は試しています
【サンプルコード】
$("form").attr("name");
2021/12/22(水) 17:43:33.97ID:ONJh0jXva
>>179
自分は取得しているものが<form 〜>であると思っています
なのでHTMLが確認したいです
2021/12/22(水) 18:34:04.36ID:VeORz/HR0
試してみたらfirefoxだと強制終了しないね
IEは消したからわからん
2021/12/22(水) 20:25:41.33ID:WODdA7db0
>>179
試してないconsole.logやconsole.dirでいいと思うが、まず試してみては?
コンソールはモーダルウインドウが開いてなくても関係ない

あなたがほしいのは$("form")[0]な気はするが
2021/12/22(水) 20:33:32.43ID:WODdA7db0
モーダルウインドウ上でコンソール出力しようとせず、モーダルウインドウを開くページから参照するとか、breakpointで止めるとか、モーダルウインドウを閉じるコードを一時的にコメントアウトするとか

モーダルウインドウを使わないのが一番だが
、Win7を使ってるならインターネットに接続してないのだろうし、相当特殊な環境だな
2021/12/22(水) 22:15:47.78ID:oJlbnIXA0
>>181-183
ありがとうございます

>>182,183
お察しの通り過去に作られたIE用のシステムをEdgeに対応する必要があり、
現時点では当時の開発環境(VS2012)でデバッグ実行しています
JavaScriptに関わるのが初めてでとにかく動かして覚えようとしているところです
$("form")[0]は明日試してみます

console.logなどを試していない(諦めた)理由は、
動作として、親ウィンドウからshowModalDialogで子ウィンドウを開く
→子でデータを選択する→親に選択したデータが入力される という流れになっており、
親画面でF12のコンソールを開いておいても子が開かれるとモーダルにより親画面のコンソールも触れない
ので諦めたんですが、もしかしてピン止め外すと止まらないんですかね?
ピン止めした状態でしか動かしてなかったので明日試してみようとおもいます

>モーダルウインドウを開くページから参照するとか、
ウィンドウ間のやりとりがまだよくわからないのでその発想に至れませんでした

>breakpointで止めるとか、
showModalDialogで開いた後に処理される関数に貼ってみたんですが
張っていないshowModalDialogの行で止まって、関数の中をステップ実行できなかったんですよね…
関数の最初にdialogArgumentsを参照してifで分岐するんですが
showModalDialog以外で呼ばれるときはステップ実行できるのでそういうものなのかと諦めました

>モーダルウインドウを閉じるコードを一時的にコメントアウトするとか
その発想はなかったです
今後のデバッグに使ってみます

ひとまず、$("form")[0]とピン止めを試してみます
2021/12/27(月) 21:01:36.58ID:XB7P0UiP0
html5のcanvasについて質問です
drawImageでこの画像をcanvasに描写した後、画像の白い部分だけを赤くマスクしたいです
https://illust8.com/wp-content/uploads/2018/08/icon_mail_illust_924.png

ctx.globalCompositeOperation = 'destination-in';

c2.globalCompositeOperation = 'darken';
を使うとオシイのですが、どうしても黒い箇所が赤くそまってしまったり、明るい方が優先されてしまったりします
何か良い手はないでしょうか?
2021/12/28(火) 10:31:30.75ID:ChI3TD7z0
今後はclassが標準になるの?
187デフォルトの名無しさん (ワッチョイ 0cdb-t0J7 [217.178.96.78])
垢版 |
2021/12/28(火) 10:36:46.52ID:ChI3TD7z0
JavaScriptのクラスは、内部的にはsuperキーワードが追加された以外は以前と変わっていません。



そのため、以前できなかったことは、今でもできません。



クラス定義を使えば、わかりやすいコードを作れるという意見もありますが、誰にとってわかりやすいかいまいち不明。
prototypeを隠蔽しているので、初心者がJavaScriptの本質を理解しにくくなる気もします。



class構文は内部でどんな置き換えをしているのか、ということを理解してからでないと、勉強にならないですね。
でも理解したら、わざわざclassを使う必要がない気がします。



使いたければ使えばいいんじゃない?と思います。
2021/12/28(火) 12:53:44.91ID:s8DIRgNG0
>>186-187
自問自答?
使いたくなければ使わなければいいと思うが、定期的にネガキャンするのは無駄なので、止めて欲しい
>>82,110
189デフォルトの名無しさん (ワッチョイ 0cdb-t0J7 [217.178.96.78])
垢版 |
2021/12/28(火) 13:05:03.77ID:ChI3TD7z0
JavaScriptのクラスは、内部的にはsuperキーワードが追加された以外は以前と変わっていません。
そのため、以前できなかったことは、今でもできません。
クラス定義を使えば、わかりやすいコードを作れるという意見もありますが、
誰にとってわかりやすいかいまいち不明。
prototypeを隠蔽しているので、初心者がJavaScriptの本質を理解しにくくなる気もします。
class構文は内部でどんな置き換えをしているのか、ということを理解してからでないと、
勉強にならないですね。
でも理解したら、わざわざclassを使う必要がない気がします。
2021/12/28(火) 13:28:00.05ID:ediH0wTa0
>>179
const form = $( 'form' )
console.log( form.length, form[ 0 ] )

HTML 内に、フォームが1つしかないなら、
form.length は1 で、form[ 0 ] でform 要素を取得できる

<form action="" id="form_1" name="form_1">
みたいに、id を付けた方が良いかも

そうすれば、これで取得できる
const form_1 = $( '#form_1' )

まあ、HTML, JavaScript, jQuery の質問は、
この板よりも、web制作管理板の方へ書き込んでください

向こうのスレが、本スレです
2021/12/28(火) 13:30:12.08ID:ediH0wTa0
今は、class を使う

今さら、prototype を使う人は、いない
2021/12/28(火) 13:50:08.36ID:ChI3TD7z0
>>191
内部構造が分かりにくい。
2021/12/28(火) 14:58:53.60ID:Gh6bV9aa0
ワイにとってはclassのほうが分かりやすいかな
2021/12/28(火) 16:37:46.66ID:ChI3TD7z0
すごい。
みんな頭いいんだな。
2021/12/28(火) 17:14:08.11ID:jIrgILJka
まあな
2021/12/28(火) 18:05:32.60ID:VM83xPh40
中がprototypeだとか別に関係ないだろう。外から見てclassとして振舞うならそれでいいわけだし。
classとしての振る舞いに何か問題があるならそこは注意すべきだが。
2021/12/28(火) 19:24:57.81ID:ChI3TD7z0
みなさんjavascript何年目?
オレは2年。
198デフォルトの名無しさん (ワッチョイ 6b01-h6Ia [122.255.141.199])
垢版 |
2021/12/31(金) 00:19:23.87ID:K3Q5NoN00
 昼食が3億!?AppleCEOや投資の神様とのランチ権オークションがすごい

スティーブ・ジョブズが亡くなった後にAppleのCEOになったのがティム・クック氏です。
そんな彼との1時間のランチ権が今年4月から5月にかけてCharitybuzzというオークションサイトに
出品され、$515,000(約5,150万円)で落札されました!
実はクックは過去にも同様の出品をしていて、今年の出品で4回目となります。

2000年からこれまでに計17回出品されているのが、「投資の神様」とも呼ばれるウォーレン・バフェット氏
とのランチミーティング権。2003年からは、世界最大級のオークションサイト「eBay」で毎年開催される
チャリティー・オークションのひとつとして出品されています。
今年6月に出品された際には、なんと$3,456,789(約3億4,568万円)で落札されました! 
2022/01/02(日) 11:53:11.76ID:qPLPCP6o0
fc2ブログを使用しているのですが、javascriptが動かない設定などあったりするのでしょうか?
<script type="text/javascript">alert("hoge");</script>

また、動かない原因をブラウザの検証から調べる事はできますか?
2022/01/02(日) 12:00:54.33ID:qPLPCP6o0
自己解決 すみませんす
2022/01/03(月) 10:30:02.94ID:ciAHc7bt0
文字数の制限をしたいのですが、htmlでoverflow hiddenするのとjsでカットするのはどちらがいいんでしょうか?
ブログのトップページなんですが、本文の1部を表示させておいて、続きを読むというリンクを設置したいなと。
<div id="text">123456789</div>

<script>
let text = document.getElementById("text");
let inner_text = text.innerHTML;
let text_length = inner_text.length;
let max_length = 5;
if(text_length > max_length){
console.log("5文字超えてます");
text.innerHTML = inner_text.substr(0,max_length);
}
</script>

これで動きはしましたけど
202デフォルトの名無しさん (ワッチョイ 6b10-45BR [180.12.82.129])
垢版 |
2022/01/04(火) 19:09:00.18ID:NiWy5jYJ0
x=<span id="x">0</span>,y=<span id="y">0</span>

<p> </p>
<div style="text-align:center">
<canvas id="canvas"></canvas>
</div>

<スクリプト>
var canvas_elm = document.getElementById("canvas");
var x_elm = document.getElementById("x");
var y_elm = document.getElementById("y");

var context = canvas_elm.getContext("2d");
canvas_elm.width = 600;
canvas_elm.height = 500;

context.fillStyle = "#0000ff";
context.fillRect(0,0,canvas_elm.width,canvas_elm.height);

canvas_elm.addEventListener(
"mousemove",
function(e){
x_elm.innerHTML = e.offsetX;
y_elm.innerHTML = e.offsetY;
}
);
</スクリプト>

canvas上でのマウスやタッチポインターの座標を表示したいんですけど、、PCではこれで座標が表示されるけど
mousemoveをtouchmoveにしてchromeでF12キーを押してスマホモードにしてタッチポインターを動かしたときxy座標がundefinedと表示されてしまいます。
スマホモードでもポインターの位置を表示できるようにするにはどうやればいいんですか?
2022/01/04(火) 19:25:07.68ID:vw+5Ecnq0
スマホなど、色々なデバイスに対応させるのは、
React, Vue.js などのフレームワークを使うのでは?

それと、JavaScript の質問は、この板よりも、
web制作管理板の方へ書き込んでください!

この板のスレは、荒らしが出て、緊急避難用に立てたものだから
2022/01/04(火) 19:34:13.24ID:vw+5Ecnq0
>>201
Ruby on Rails では、続きを読むのは、truncate(文字数)。
Railsがどういう実装をしているかまでは知らないけど

npm とか、Lodash とかに、そういう関数が無いのか?

「javascript 続きを読む」「css 続きを読む」で検索してみれば?
2022/01/04(火) 20:53:53.77ID:QGpHZiP/0
>>202
タッチイベントにはevent.offsetX, event.offsetYはありません
event.changedTouches[0].pageX等から計算してください
206デフォルトの名無しさん (ワッチョイ 6b10-45BR [180.12.82.129])
垢版 |
2022/01/04(火) 22:55:40.12ID:NiWy5jYJ0
そうなんですか
ありがとうございます
2022/01/05(水) 10:08:51.69ID:D2CbxegU0
>>206
どう致しまして。
208デフォルトの名無しさん (ワッチョイ 6b10-nofO [180.12.82.129])
垢版 |
2022/01/06(木) 12:37:03.20ID:qVRSVavo0
質問1 element.addeventlistnerとdocument.addeventlistnerの違いは?
質問2 
function(elm){
elm.addeventlistner(
"click",
function(e){alert("クリック");}
);
}
のような関数がある場合document.addeventlistnerの場合はelementがないので個別に関数作らないとだめなのか?
2022/01/06(木) 12:51:53.90ID:/RkhTEU50
外側・親に、イベントを付けて、親で、子のイベントをキャッチできる。
jQuery で書いた

<div id="btn-wrap">
<button class="BtnA BtnAll" value="1">A-1</button>
<button class="BtnA BtnAll" value="2">A-2</button>
<button class="BtnB BtnAll" value="3">B-3</button>
</div>

// 外側・親に、イベントを付けて、親で、子のイベントをキャッチする

$( '#btn-wrap' ).on( 'click', function ( event ) {
console.log( $( event.target ).prop( 'value' ) )
} );

この板よりも、web制作管理板の方へ書き込んでください!
そちらの方が、本スレです
2022/01/06(木) 13:04:40.48ID:nb3ueMLOM
>>208
1. 対象要素が違うだけ。バブリングによって「あらゆる要素」のイベントをトラップしたい場合は後者を使うといい(一般的には普通は比較的近いコンテナ要素でトラップするもんだが...)
2. その関数なら共通でOK

>>209
本当に誘導したいなら、せめてリンクを貼りましょう
211デフォルトの名無しさん (ワッチョイ 1b23-hDuN [120.51.55.80])
垢版 |
2022/01/06(木) 14:19:29.65ID:j/6fwGrk0
このスレで質問しても何の問題もありません
荒らしやアフィリエイト宣伝業者に騙されて誘導されないようにしてください
2022/01/06(木) 15:06:56.73ID:cXhLxUi00
>>208
回答1
event.currentTargetが異なる

回答2
e.targetを確認すれば良い
2022/01/06(木) 15:09:56.94ID:cXhLxUi00
>>209
Web制作板でも次スレが立たず、旧スレを再利用してる状態
本スレなど存在していない

本気で本スレに誘導したいなら、最新スレを探して次スレを立てて保守すべき
それぐらいの情熱がある人はもういないと思ってたが、あなたがそうしたいのなら止めはしない
2022/01/06(木) 16:09:40.84ID:/RkhTEU50
この板のスレは元々、web制作管理板が荒らされた時に、緊急避難用に立てられたもの。
本スレは、向こうの方

この板は荒らしが多い

荒らしは短文で、必ず2回書き込む。
複数回書き込むことで、多くの人が書いているように見せる

それと、テンプレをしょっちゅう、自分が有利なように書き換える

Python のスレのテンプレとか、ひどい。
NGワードは何々とか、しょっちゅう書き換えている

まあ、ソースコードを書かない香具師は、
プログラマーじゃないから、相手にしない方がよい
2022/01/06(木) 21:02:16.03ID:Ozp6fgWI0
window.onload = function(){
}
このfunctionって何の意味があるんですかね?
2022/01/06(木) 21:09:14.63ID:N8zU5Utu0
中の変数とかを外から見えなくしてるんじゃない?
2022/01/06(木) 21:28:50.56ID:aRDKku+G0
>>215
変数 = function() { ... }
で関数式(無名関数)っていう形で定義できる

関数式についての説明はこの辺を参照
https://ja.javascript.info/function-expressions
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Functions

で、window.onload = function() { ... }
っていう風に実装すると、少し特殊な動きになって
HTMLを完全に読み込んだタイミングで、関数の中身を実行するっていう動きになる
https://developer.mozilla.org/ja/docs/Web/API/GlobalEventHandlers/onload

(他言語だとあんまり見ない書き方だから混乱するかもしれんけど)
218超面白いyoutubeチャンネル (ワッチョイ cb01-45BR [60.111.41.11])
垢版 |
2022/01/06(木) 21:52:51.91ID:eAd55W1B0
https://www.youtube.com/channel/UC9UsyidyKO-s6K8sgWKmE2w
2022/01/07(金) 07:23:20.82ID:RiDo7mPm0
>>217
変数に関数を入れられるんですよね。
処理を直には入れられないから、関数で包むとイメージなんでしょうかね。
2022/01/07(金) 13:51:45.20ID:RiDo7mPm0
<div class="content">

<h2>header2</h2>

<h2>header2-2</h2>

<h2>header2-3</h2>

<h2>header2-4</h2>

</div>



<script>

let content = document.getElementsByClassName("content");

let all_element = content.querySelectorAll("h2");

console.log(all_element);

</script>

gebcnで取得したターゲットにqueryselectorは使えないんでしょうか?
idで取得したものなら可能なんですけども。
2022/01/07(金) 14:27:21.79ID:YQSfQDAQ0
>>220
contentはgetElementsでHTMLCollectionをとってるので
content[0]とかにすればでるんじゃない?
2022/01/07(金) 18:28:49.81ID:RiDo7mPm0
>>221
返り値が違うんですね。
要素だけを取ってくるもんだと思っていました。

ありがとうございます。
2022/01/07(金) 18:31:00.59ID:RiDo7mPm0
エレメントしかいらないのならid使ったほうが良いみたいですね
2022/01/07(金) 18:36:46.10ID:HaEbTiQw0
document.querySelectorAll(".content > h2");
でよくね?
2022/01/07(金) 20:54:20.38ID:RiDo7mPm0
こういった場合クラスを使うんでしょうか?
cssではidは出来るだけ使わないということになっているらしいですが
2022/01/07(金) 21:09:58.61ID:/l7S/g/G0
できるだけ使わないというか詳細度に関わる
1ページ一回というユニークルールもcss使い回しに不向き
2022/01/08(土) 05:37:14.84ID:ly/XOtiZ0
classnameでやってみますです
2022/01/08(土) 05:41:40.78ID:ly/XOtiZ0
>>224
そうやって書けるんすね
html collectionの構造がよくわからんくて
2022/01/08(土) 05:48:14.75ID:ly/XOtiZ0
>>224
いや、これだめでしたね
nodelistは帰ってきますけど、h2はとれてないです
2022/01/08(土) 05:55:36.78ID:fLniY7PXM
全てconstでOK
231デフォルトの名無しさん (スプッッ Sdbf-d5qO [1.79.82.91])
垢版 |
2022/01/08(土) 07:52:36.25ID:GNp2CfCTd
Android10 F-51A
Chrome 93.0.4577.62

ブラウザ上での画像についての質問です。
画像自体は恐らく読み込めているようなのですが、全く映らないか、映っても一瞬で消えてしまいます。
エラーメッセージは出ません。
ファイルマネージャーというアプリから起動すると、正常に動作します。

考えられる原因、解決案は、例えば何があるでしょうか。
絶対パスというものなら出来るかと思ったのですが、自分のやり方が悪いのか、上手く行きませんでした。
2022/01/08(土) 09:00:28.06ID:5hFueUuG0
>>229
最初の一個だけでいいなら
let all_element = document.querySelector(".content h2")
2022/01/08(土) 09:52:41.58ID:UKENl29p0
>>231
情報が少なすぎて詰めきれません。もう少し詳細な情報を提供できませんか?
(まず、JavaScriptはどのように使用していますか?)
234デフォルトの名無しさん (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 10:15:27.19ID:GNp2CfCTd
>>233
スマホアプリの「QuickEdit」というテキストエディタで制作しています。

そういう意味じゃなかったらごめんなさい。

$Game_Image_Data = [];
$Game_Image_Data[0] = new Image(); $Game_Image_Data[0].src = "image/player.png";

これで「$Game_Image_Data[0].src」をアラートで出力すると、こうなります。

https://i.imgur.com/FzEkdyk.jpg
2022/01/08(土) 14:43:01.70ID:ly/XOtiZ0
>>232
どうも。今回はindex使うことにしてみます。
236231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 17:15:55.99ID:GNp2CfCTd
可能な限り絞り込み? ました。

検証にご協力していただける方は、「imageフォルダに適当な「player.png」の画像を挿入して、実行してみてください。

ここまである程度余計な要素を取り除いたので、流石にこれならいけるんじゃないか? と思ったのですが、自分の環境ではやはり駄目でした。

よろしくお願いいたします。
237231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 17:19:01.00ID:GNp2CfCTd
<! html>
<html>
<head>
<meta ="utf-8"/>
<title>No_Name_Game</title>
</head>
<body>
<div id="Original_Game_Windows">
<canvas id="Game_Main_Window" width="640" height="480" style="background-color:#000000;"></canvas>
</div>
<style>
body { margin: 0; padding: 0; }
#Original_Game_Windows {
width: 640px;
height: 480px;
position: relative;
}
</style>
</body>
238231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 17:22:09.26ID:GNp2CfCTd
ごめんなさい、貼り付けるの無理でした。
2022/01/08(土) 17:26:57.57ID:c2V21ewI0
>>236
サーバーに画像アップロードしないとだめですよ?
240231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 17:42:45.65ID:GNp2CfCTd
https://www.axfc.net/u/4048256
241231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 17:44:17.60ID:GNp2CfCTd
斧を使わせて貰いました。
よろしくお願いします。
242231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 17:44:45.13ID:GNp2CfCTd
>>239
もちろん承知しています。
それで試しても駄目でした。
2022/01/08(土) 18:53:38.87ID:c2V21ewI0
>>242
>>234のalertに表示されてるアドレスNot Foundだけど?
244231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 19:05:34.21ID:GNp2CfCTd
>>243
この文章って、そういう意味なのですか?
てっきり、アクセスは出来てるという意味だと勘違いしていました。
勉強不足で申し訳ありません。

ただ、今回は確実に、ちゃんと画像もフォルダ内にアップロードしたのですが、上手く行きませんでした。


https://i.imgur.com/7tRCd4P.jpg
https://i.imgur.com/AM1zYbJ.jpg
https://i.imgur.com/Egje64L.jpg
2022/01/08(土) 19:12:51.05ID:c2V21ewI0
>>244
頭のpが大文字じゃないですか…
246231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 19:26:33.45ID:GNp2CfCTd
>>245
ありがとうございました。

私が馬鹿すぎました。
ネタでやってたんじゃないです。ガチです。お騒がせしました。本当にありがとうございました。
247231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/08(土) 19:30:48.95ID:GNp2CfCTd
>>245
報告までに。
一応確認したところ、無事成功しました。
ありがとうございました。
2022/01/08(土) 20:24:29.61ID:70jc3KgD0
ドンマイ
2022/01/08(土) 20:40:02.49ID:6njacc4u0
わりとやらかすミスだからしゃーない
2022/01/09(日) 01:12:15.51ID:lzN+drLE0
>>229
const elems = document.querySelectorAll(".content > h2");
console.log( elems, elems[ 0 ] )

これで、4つのh2が、ちゃんと取れている

NodeList(4) [h2, h2, h2, h2]
NodeList <h2>​header2​</h2>​

この板よりも、web制作管理板の方で聞いた方がよい。
向こうのスレが、本スレだから
251デフォルトの名無しさん (ワッチョイ 6501-dXQO [126.29.248.173])
垢版 |
2022/01/09(日) 01:27:51.26ID:wKoMs7Y50
そいつは、>1 のテンプレをしょっちゅう改変している、テンプレ改変荒らし。
基本的に、ソースコードを書かない香具師は荒らし

「Ruby, Rails, クソチョン」などを、NGワード登録推奨とか、
自分が有利なように、いつもテンプレを改変する

荒らしがスレ主として、居座っているので、
まともな人がスレ立てして、テンプレも元に戻した方がよい

荒らしは必ず、短文で2回以上書き込む。
必ず、複数人がいるように見せかける
2022/01/09(日) 02:26:51.89ID:WLNeqQAW0
>>251
統合失調症ですか?
2022/01/09(日) 10:47:02.34ID:94EdrQaq0
>>250
「本スレはない」といっても伝わってなかったんだな >>213
Web制作板のスレは長らく次スレが立ってない
複数ある過去スレ(重複)を質問者が好き勝手に選んで再利用してるだけ
利用者も「重複だから本スレはこちら」などの誘導は誰もやってないし、どれが本スレとか誰も把握してない
繰り返すが、そもそもスレ消化時に次スレが立たなかったのでWeb制作板の本スレは消滅している
Web制作板のスレを追いかけてきたなら知ってるはずなんだがな
2022/01/09(日) 10:50:05.66ID:zqBk0tn4M
>>250
本気で誘導したいならリンクを貼りましょう
255231 (スプッッ Sd03-Ylb5 [1.79.82.91])
垢版 |
2022/01/09(日) 11:32:48.03ID:8qT6W49sd
昨日はお世話になりました。
二日連続になって申し訳ないのですが、質問させていただきます。

localStorageに保存しておける文字数って、あんまり多くないのでしょうか?

2000×400字ほどで、エラーが出てしまいます。
2000×300字だと問題なかったので、やり方じゃなく文字数の関係なのかと思ったのですが、どうなんでしょうか。

ちなみに、配列、オブジェクト型データです。
2022/01/09(日) 11:40:12.10ID:81xkTGx10
>>255
文字数というより、localStorageのデータ保存量の上限は基本5MBで
ブラウザや個人設定によって変わってくる
http://www.htmq.com/webstorage/
■ このスレッドは過去ログ倉庫に格納されています
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。

ニューススポーツなんでも実況