ホームページ > 記事 > ウェブフロントエンド > javascript_javascript スキルで実装された入力、ボタンなどのフォーム要素の動的追加 (appendChild)
javascript_javascript スキルで実装された入力、ボタンなどのフォーム要素の動的追加 (appendChild)
- WBOYオリジナル
- 2016-05-16 19:07:371393ブラウズ
小規模なシステムを作成する場合、フォーム要素を動的に追加する必要があるため、このチュートリアルは私自身の実装方法に従って作成しました。
多くの Web サイトで同様の効果が見られたと思います。
1. ドキュメントを使用します。 createElement メソッドで入力要素を作成します。
コードをコピー コードは次のとおりです。
var newInput = document.createElement("input ");
2. 名前、タイプなどの関連する属性を設定します。
コードをコピー コードは次のとおりです:
newInput.type=mytype;
コードをコピーします コードは次のとおりです。
TemO.appendChild(newInput); >
Javascript コア コード:
Javascript コア コード:
コードをコピー コードは次のとおりです:
<スクリプト言語 ="javascript"> function AddElement(mytype){
var mytype,TemO=document.getElementById("add");
var newInput = document.createElement("input") ");
newInput.type=mytype;
newInput.name="input1";
TemO.appendChild(newInput);
var newline= document.createElement("br");//改行機能のBRタグを作成しましょう！
TemO.appendChild(newline);
}
var mytype,TemO=document.getElementById("add");
var newInput = document.createElement("input") ");
newInput.type=mytype;
newInput.name="input1";
TemO.appendChild(newInput);
var newline= document.createElement("br");//改行機能のBRタグを作成しましょう！
TemO.appendChild(newline);
}
[Ctrl A すべて選択 注: 外部 Js を導入する必要がある場合は、 を実行するために更新する必要があります]
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。