ホームページ >ウェブフロントエンド >jsチュートリアル >javascript_javascript スキルを使用してチェックボックスを動的に追加する方法
javascript_javascript スキルを使用してチェックボックスを動的に追加する方法
- PHP中文网オリジナル
- 2016-05-16 15:24:052331ブラウズ
この記事の例では、JavaScript を使用してチェックボックスを動的に追加する方法を紹介します。
実際のアプリケーションでは、チェックボックスを動的に追加する必要がある場合があります。この効果を実現する方法について簡単に説明します。
チェックボックスを作成するのは非常に簡単です。コードは次のとおりです。
var oCheckbox=document.createElement("input");
oCheckbox.setAttribute("type","checkbox");
oCheckbox.setAttribute("id","mayi");しかしこれはチェックボックス オブジェクトを作成するだけですが、実際のアプリケーションでは通常、チェックボックスの前後に説明テキストがあるため、実際のニーズを満たすことができないことがよくあります。この効果を実現する方法を次に示します。
メソッド。チェックボックス オブジェクトを作成し、次にテキスト ノードを作成して、それを p に追加します。
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<title>添加checkbox复选框</title>
<script type="text/javascript">
var oCheckbox=document.createElement("input");
var myText=document.createTextNode("蚂蚁部落");
oCheckbox.setAttribute("type","checkbox");
oCheckbox.setAttribute("id","mayi");
window.onload=function(){
var mydiv=document.getElementById("mydiv");
mydiv.appendChild(oCheckbox);
mydiv.appendChild(myText);
}
</script>
</head>
<body>
<div id="mydiv"></div>
</body>
</html>上記は javascript_javascript スキルにチェックボックスを動的に追加する方法です。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) をご覧ください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。