+ JavaScript の質問用スレッド vol.126 +at HP
+ JavaScript の質問用スレッド vol.126 + - 暇つぶし2ch721:Name_Not_Found
24/09/01 21:06:11.29 0iCkG2Yk.net
このコードをinnerHTMLではなくtextContentで書くことってできる?
MDNにinnerHTMLはセキュリティリスクがある的なことが書いてある感じで、どうすればいいのかわからず
const links = [
'<a href="URLリンク(aaa.com)',
'<a href="URLリンク(bbb.com)',
'<a href="URLリンク(ccc.com)'
]
const linkRandom = Math.floor(Math.random() * links.length)
document.getElementById('randomLink').innerHTML = links[linkRandom]

722:Name_Not_Found
24/09/01 22:12:18.90 .net
target_element.setAttribute(‘href’, links[i].url);
target_element.textContent = links[i].text;
or
const link = document.createElement(“a”);
link.setAttribute(‘href’, links[i].url);
link.textContent = links[i].text;
target_element.replaceWith(link);

723:Name_Not_Found
24/09/02 11:36:14.68 khZNcjYy.net
そんな使い方なら
リスク関係ないじゃん

724:Name_Not_Found
24/09/03 06:43:47.48 YY8JHFIf.net
使い方的にリスクがないってこと!?
ここがわからないんだけど
links[i].url
links[i].text
もしかしてjQueryっていうライブラリの機能?

725:Name_Not_Found
24/09/03 06:46:11.57 YY8JHFIf.net
とりあえずこれで上手くいったんだけど
urlとtextが別の場所にあるので、使ってるうちに時々間違えそうな気がする
const randomLink1 = document.getElementById('randomLink1');
const linkUrls = [
'URLリンク(aaa.com)',
'URLリンク(bbb.com)',
'URLリンク(ccc.com)'
];
const linkTexts = [
'siteA',
'siteB',
'siteC'
];
const linkNum = Math.floor(Math.random() * linkUrls.length);
const Url = linkUrls[linkNum]
const Text = linkTexts[linkNum]
randomLink1.setAttribute('href', Url);
randomLink1.textContent = Text;

726:Name_Not_Found
24/09/03 06:47:06.44 YY8JHFIf.net
とりあえず回答ありがとう

727:Name_Not_Found
24/09/03 18:58:22.09 HnK+yF6X.net
>>724
innerHTMLのよろしくないところは
突っ込まれた文字列がすぐにHTMLとして評価されてしまうこと
なのでscript要素とか
onerror属性付きimg要素とか突っ込まれても
無条件に評価してJS実行しちゃう
そんなわけで、いろんなものを引き受けて
それをinnerHTMLに突っ込む仕組み
みたいなものを作るのはリスキーなわけだけど
けど>>721の使い方にはそんな余地はないじゃん?
じゅうぶんセーフティ

728:Name_Not_Found
24/09/03 21:03:01.23 YY8JHFIf.net
ちょっと内容が難しいけど、余地がなくセーフティーなんだ
わかったありがとう

729:Name_Not_Found
24/09/04 02:26:08.22 .net
この頭じゃ全然大丈夫じゃなさそうで心配

730:Name_Not_Found
24/09/08 02:31:54.41 AjuY/yt0.net
>urlとtextが別の場所にあるので、使ってるうちに時々間違えそうな気がする
俺ならobject使って1変数にまとめるかな
const links:{[key:"text"|"url",url:string}[] = [
{text:"siteA",url:"URLリンク(aaa.com)
{text:"siteB",url:"URLリンク(bbb.com)
{text:"siteC",url:"URLリンク(ccc.com)
]

731:Name_Not_Found
24/09/08 09:00:01.21 Q6ZYRY7o.net
>>730
見るからに初心者っぽい人に
断りなくts書くのは
ちょっと不親切だと思うの

732:Name_Not_Found
24/09/08 12:40:55.68 .net
>>730
>const links:{[key:"text"|"url",url:string}[]
間違いが多すぎやろw

733:Name_Not_Found
24/09/30 11:49:15.76 .net
html開いた時にソース内の記述全部読み込むんじゃなく
特定のボタン押した時にだけ画像やテキスト読み込むjavascriptサンプルってある?

734:Name_Not_Found
24/09/30 11:58:25.19 9ghRlxN3.net
>>733
ある

735:Name_Not_Found
24/09/30 15:09:05.71 .net
>>733
そのくらいならChatGPTに聞けばよい

736:Name_Not_Found
24/10/31 00:05:10.90 r3dI7c5/.net
誰かEchoAPIを聞いたことがあるのか
それはプログラムの効率を高めることができるって聞いて


最新レス表示
レスジャンプ
類似スレ一覧
スレッドの検索
話題のニュース
おまかせリスト
オプション
しおりを挟む
スレッドに書込
スレッドの一覧
暇つぶし2ch