javascriptで、dblclickでcreateElementを使いdiv要素を作成してappendChildでbodyの部分にdiv要素を挿入することを考えています。
(この部分は自分で解決できました。)
この際、dblclickのたびにdiv要素を挿入するのではなく、すでにdblclickでdiv要素が挿入されている場合にはdiv要素を改めて挿入しないようにしたいのですが、どのようにすれば改めてdiv要素を挿入しないようにできるのでしょうか。
javascript初心者です。宜しくお願い致します。
No.2ベストアンサー
- 回答日時:
現状のソースの全貌が見えないのでなんともいえませんが、次のサンプルのような感じで。
<html>
<head>
<title></title>
<script type="text/javascript">
function sample(){
if(document.getElementById('XYZ')) return;//id='XYZ'のエレメントは既に在る
var Div = document.createElement('div');
Div.setAttribute('id','XYZ');
Div.innerHTML='追加しました';
document.body.appendChild(Div);
}
</script>
</head>
<body>
<p><input type="button" value="DIV生成" onclick="sample()"></p>
</body>
</html>
度々ありがとうございます。
参考にさせて頂いて、if文を追加する位置を変更したら、うまくいくようになりました。
どうもありがとうございました。
No.1
- 回答日時:
作成するdivにはidを付ける。
作成するときにdocument.getElementByIdで、既に存在していないか確認する。
(既に存在していれば作成しない)
早速の回答ありがとうございます。
参考にさせていただいて、if文を使ってdiv要素にsetAttributeでidを付与して試してみたのですが、はじめてdblclickした時点ではまだidをつけたdiv要素が作成されていないためか(?)、「document.getElementById("id名") has no properties」とのエラーがでてしまいます。なにか失念していることがあるのでしょうか?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- JavaScript 指定したパスが現URLに含まれていたら特定要素を削除するJavascriptのコードを教えてください 2 2023/04/27 17:58
- PHP ここでの ②if($su_d<>"")の比較演算子 を使う理由は 1 2022/03/26 02:33
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- Visual Basic(VBA) Selenium Basicの件 5 2023/04/10 20:55
- その他(プログラミング・Web制作) pythonでのカーソル移動がずれる 2 2023/07/30 08:51
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
MAX関数を使ってからLEFT JOIN...
-
前回の質問の続き
-
createElementで作成した要素を...
-
読み込んだQRコードをフォーム...
-
jQueryで特定id以外の下にある...
-
表示・非表示のスクリプトで、...
-
iframe内のリンクが飛ばないの...
-
classの中の<a>タグにidを追加
-
removeEventListenerについて
-
getElementByIdの戻り値がnull...
-
クリックするとテーブルの列の...
-
複数のリンク画像を一定時間で...
-
console.log結果をhtmlで表示し...
-
クリックする度に表示/非表示が...
-
javascriptにフェードインを追...
-
[JavaScript]IE11にてフリック...
-
jQueryで同じid属性が複数あっ...
-
javascriptでオブジェクトの重...
-
onclickを使わずにクリック元を...
-
JSで動的にリンクを作成
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
MAX関数を使ってからLEFT JOIN...
-
javascriptテキストBOX色を元に...
-
createElementで作成した要素を...
-
読み込んだQRコードをフォーム...
-
console.log結果をhtmlで表示し...
-
iframe内のリンクが飛ばないの...
-
変数内容をHTML内で表示する方法
-
getElementByIdの戻り値がnull...
-
背景色を透明化
-
自働生成される<div>タグに連番...
-
複数のリンク画像を一定時間で...
-
クリックで色変更後に既に変更...
-
removeEventListenerについて
-
IFRAMEの表示/非表示を切り替え...
-
表示・非表示のスクリプトで、...
-
タブで開いてさらにタブ内をア...
-
Jquery 親要素で順番入れ替え
-
HTML id名とjavascript変数名
-
VBScriptでXMLのデータを取得す...
-
[急ぎ] videoタグで埋め込んだm...
おすすめ情報