[新着] Webテンプレートを仮オープンしました
<HTML>
<HEAD>
<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
<!--
var x;
function a(){
x = "<input type='checkbox' value='a'>動物です";
b()
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<form name="frm">
<SELECT NAME="animal" onchange="a()">
<OPTION VALUE="00">犬
<OPTION VALUE="01">ネコ
</SELECT>
<script language = "javascript">
function b(){
document.write(x);
}
</script>
<form>
</BODY>
</HTML> <script type="text/javascript"><!--
function create() {
var divObj = document.getElementById("pBox");
var chObj = document.createElement("input");
chObj.setAttribute("type","checkbox");
divObj.appendChild(chObj);
}
// --></script>
</head>
<body>
<form>
<input type="button" id="myButton" value="Click" onClick="create()">
</form>
<div id=pBox></div>
</body>function create()
{
var newDiv = document.createElement("div");
var oldDiv = document.getElementById("pBox");
var chArray = ["いぬ", "ねこ"];
if(oldDiv != null)
oldDiv.parentNode.removeChild(oldDiv);
document.getElementsByTagName("body")[0].appendChild(newDiv);
newDiv.setAttribute("id", "pBox");
for(var ix = 0; ix < chArray.length; ix++)
{
var chObj = document.createElement("input");
var textObj = document.createTextNode(chArray[ix]);
var brObj = document.createElement("br");
chObj.setAttribute("type", "checkbox");
newDiv.appendChild(chObj);
newDiv.appendChild(textObj);
newDiv.appendChild(brObj);
}
}
// DOM Core（基本モジュール）な方法
newDiv.setAttribute ('id', 'pBox');
chObj.setAttribute ('type', 'checkbox');
// DOM HTML（HTML に特化したモジュール）な方法
newDiv.id = 'pBox';
chObj.type = 'checkbox';<script language="JavaScript">
<!--
var k1_Array = new Array(0);
k1_Array[0] = ["1","海の生物"];
k1_Array[1] = ["2","山の生物"];
var k2_Array = new Array(0);
k2_Array[0] = ["1","1","魚類"];
k2_Array[1] = ["2","1","哺乳類"];
k2_Array[2] = ["3","2","爬虫類"];
var k3_Array = new Array(0);
k3_Array[0] = ["1","1","1","サメ"];
k3_Array[1] = ["2","1","1","マグロ"];
k3_Array[2] = ["3","1","2","イルカ"];
k3_Array[3] = ["4","1","2","クジラ"];
k3_Array[4] = ["5","2","3","ヘビ"];
k3_Array[5] = ["6","2","3","トカゲ"];
var newDiv = document.createElement("div");
function load(){
for(var i=0; i<k1_Array.length; i++){
document.frm.k1.options.length = k1_Array.length;
document.frm.k1.options[i].text = k1_Array[i][1];
document.frm.k1.options[i].value = k1_Array[i][0];
}
var count = 1;
for(var i=0; i<k2_Array.length; i++){
if(k2_Array[i][1] == 1){
document.frm.k2.options.length = count;
document.frm.k2.options[count-1].text = k2_Array[i][2];
document.frm.k2.options[count-1].value = k2_Array[i][0];
count++;
}
}
document.getElementById("ch").appendChild(newDiv);
newDiv.id="ch";
for(var i=0;i<k3_Array.length; i++){
if(k3_Array[i][1]==1 && k3_Array[i][2]==1){
var chObj = document.createElement("input");
var textObj = document.createTextNode(k3_Array[i][3]);
var brObj = document.createElement("br");
chObj.type="checkbox";
newDiv.appendChild(chObj);
newDiv.appendChild(textObj);
newDiv.appendChild(brObj);
}
}
}
function k1_ch(){
var k1_val = document.frm.k1.value;
count = 1;
for(var i=0; i<k2_Array.length; i++){
if(k2_Array[i][1] == k1_val){
document.frm.k2.options.length = count;
document.frm.k2.options[count-1].text = k2_Array[i][2];
document.frm.k2.options[count-1].value = k2_Array[i][0];
count++;
}
}
var oldDiv = document.getElementById("ch");
if(oldDiv != null){
oldDiv.parentNode.removeChild(oldDiv);
}
newDiv = document.createElement("div");
document.getElementById("ch").appendChild(newDiv);
newDiv.id="ch";
for(var i=0; i<k3_Array.length; i++){
if(k3_Array[i][1] == k1_val && k3_Array[i][2] == document.frm.k2.options[0].value){
var chObj = document.createElement("input");
var textObj = document.createTextNode(k3_Array[i][3]);
var brObj = document.createElement("br");
chObj.type="checkbox";
newDiv.appendChild(chObj);
newDiv.appendChild(textObj);
newDiv.appendChild(brObj);
}
}
}
// -->
</script>
</head>
<body onload="load()">
<form name ="frm">
<select name="k1" onchange="k1_ch()">
</select>
<select name="k2">
</select>
<div id="ch"></div>
</form>
</body> var oldDiv = document.getElementById("ch").firstChild;
if(oldDiv != null){
oldDiv.parentNode.removeChild(oldDiv);
}<!-- 引数として select 要素ノード自身を渡す --> <select name="k1" onchange="k1_ch(this)"> <!-- 引数として select 要素が属する form 要素を渡す --> <select name="k1" onchange="k1_ch(this.form)">
var sel_1 = document.createElement("select");
sel_1.name="k1";
sel_1.onchange="k1_load()"; //記述方法はあっているでしょうか？
var newCh1 = document.getElementById("ch1").appendChild(sel_1);
for(var i=0; i<k1_Array.length; i++){
var chObj1 = document.createElement("option");
chObj1.value=k1_Array[i][0];
var textObj1 = document.createTextNode(k1_Array[i][1]);
sel_1.appendChild(chObj1);
chObj1.appendChild(textObj1);
}
var k1_val = sel_1.childNodes[0].firstChild.Value;
//一番上に表示されているリストボックスのValue値はこれでもってこれるんでしょうか？sel_1.onchange = k1_load;
// 引数が必要なら（k1_load 関数内の this 値が変わるので注意）
sel_1.onchange = function () { k1_load (this); };