美高梅网址 > 游侠网单机游戏 > 新创建一个元素节点

原标题:新创建一个元素节点

浏览次数:189 时间:2019-11-01

<input type="radio" name="type" value="city">城市
<input type="radio" name="type" value="game">游戏

//8. 利用 nameVal 创造文本节点
var content = document.createTextNode(nameVal);

//7. 创建 li 节点
var liNode = document.createElement("li");

<ul id="city">
<li id="bj">北京</li>
<li>上海</li>
<li>东京</li>
<li>首尔</li>
</ul>

新加上newChild子节点,该子节点将用作elementNode

//1. 获取 #submit 对应的开关 submitBtn
var submit = document.getElementById("submit");

var  liNode =document.creatElement("li");

function showContent(liNode){
alert("^_^#" + liNode.firstChild.nodeValue);
新创建一个元素节点。}

name: <input type="text" name="name"/>

//6. 把 nameVal 和 "" 举办相比, 借使 "" 表明只出入了空格, 弹出 "请输入内容"
//方法结束: return false
if(nameVal == ""){
alert("请输入内容");
return false;
新创建一个元素节点。}

//4. 检查是不是接收 type, 若没有选取给出提醒: "请选用项目"
//4.1 采取具备的 name="type" 的节点 types
var types = document.getElementsByName("type");

//需要2: 使满含新添的 li 都能响应 onclick 事件: 弹出 li 的文件值.

新创建一个元素节点。cityNode.appendChild(liNode);

window.onload = function(){

var cityNode=document.getElementById("city");

1,新创制多少个成分节点,重临值为指向成分节点的援引

 

<p>你赏识哪个城市?</p>

<br><br>
<p>你欢欣哪款单机游戏?</p>
<ul id="game">
<li id="rl">红警</li>
<li>实况</li>
<li>精品飞车</li>
<li>魔兽</li>
</ul>

新创建二个因穷秋点,并把该节点增添为文书档案中钦赐节点的子节点

<input type="submit" value="Submit" id="submit"/>

//6. 去除 nameVal 的上下空格.
var reg = /^s*|s*$/g;
nameVal = nameVal.replace(reg, "");

2,创造贰个文件节点 creatTextNode

//3. 在 onclick 响应函数的结尾处增多 return false, 就足以打消提交按键的
//暗许行为.
return false;
}
}

var xmText=document.creatTextNode("厦门");

</form>

<form action="dom-7.html" name="myform">

//11. 为新创造的 li 增添 onclick 响应函数
liNode.onclick = function(){
showContent(this);
}

//10. 把 7 加为选拔的 type 对应的 ul 的子节点
document.getElementById(typeVal)
.appendChild(liNode);

var liNodes = document.getElementsByTagName("li");
for(var i = 0; i < liNodes.length; i++){
liNodes[i].onclick = function(){
showContent(this);
}
}

 

//2. 为 submitBtn 增多 onclick 响应函数
submit.onclick = function(){

//4.3 若未有任何多少个 type 被入选, 则弹出: "请选种". 响应措施甘休:
//return false
if(typeVal == null){
alert("请选择品种");
return false;
}

//4.2 遍历 types, 检查其是不是有三个 type 的 checked 属性存在, 就可注脚
//有贰个 type 被选中了: 通过 if(元商节点.属性名) 来决断某一个成分节点是或不是有
//该属性.
var typeVal = null;
for(var i = 0; i < types.length; i++){
if(types[i].checked){
typeVal = types[i].value;
break;
}
}

//须要: 点击 submit 开关时, 检查是或不是采用 type, 若未有选用给出提醒: "请采纳项目";
// 检查文本框中是否有输入(能够去除前后空格), 若未有输入,则交由提醒: "请输入内容";
//若检查都经过, 则在相应的 ul 节点中加上对应的 li 节点

//9. 把 8 加为 7 的子节点
liNode.appendChild(content);

</script>
</head>
<body>

//5. 获取 name="name" 的文本值: 通过 value 属性: nameVal
var nameEle = document.getElementsByName("name")[0];
var nameVal = nameEle.value;

<br><br>

//使 name 的文本框也去除前后空格.
nameEle.value = nameVal;

本文由美高梅网址发布于游侠网单机游戏,转载请注明出处:新创建一个元素节点

关键词:

上一篇:X君有段时间在

下一篇:没有了