欢迎您访问我爱IT技术网，今天小编为你分享的javascript教程：【javascript 学习笔记（一）DOM基本操作】，下面是详细的讲解！
javascript 学习笔记（一）DOM基本操作
html部分代码：
当点击show按钮时，触发showValue函数，将input value的值动态添加到id="text"的元素节点中！
<p>
<input type="text" value="" name="user_name" id="user_name" />
<span style="padding-left:10px;"><input type="button" value="show" onclick="showValue()" /></span>
</p>
<p id="text"></p>
javascript 部分代码：
页面加载时，使input自动获得焦点，引导用户输入内容。（细节加强用户体验）
window.onload=function() {
var user_name=document.getElementById("user_name");
user_name.focus();
}
如果没有输入任何内容，给出错误提示，同时又让input获得输入焦点
function showValue() {
var user_name=document.getElementById("user_name");
var text=document.getElementById("text");
if(user_name.value=="") {
alert("Please input some words");
user_name.focus();
} else {
text.innerHTML=user_name.value;
text.setAttribute("class", "text");
}
}
HTML代码中的<div id="test"></div>完全可以不用，我们可以利用DOM动态创建，并添加到文档中！
//创建div元素
var text=document.createElement("div");
//把user_name.value的值添加到div元素中来
text.appendChild(user_name.value);
//最后将div元素添加到body中来
document.body.appendChild(text);
关于javascript 学习笔记（一）DOM基本操作的用户互动如下：
相关问题：谁有javascript学习笔记呀，给我发一下谢谢了。
答：在网上下载学习手册！ 百度搜：javascript手册下载 >>详细
相关问题：javascript自学
答：你应该学css，并且会做页面，然后再学javascript，而且我不太推荐只接看教程，因为网页上很多效果都是js控制html+css实现的各种效果，单纯的学js几乎没什么用，你需要对css达到熟练的程度，然后js不太用看教程，最主要学js的dom操作、基本的循环... >>详细
相关问题：JavaScript Dom操作
答：具体JavaScript Dom操作还得看你的html文档定义，而且你的问题前提条件一点也不明确 >>详细
- 【firefox】firefox浏览器不支持innerText的解决
- 【Extjs】Extjs学习过程中新手容易碰到的低级错误
- 【clearInterval】js clearInterval()方法的定义
- 【dom】javascript dom追加内容实现示例-追加内容
- 【checkbox】让checkbox不选中即将选中的checkbox
- 【Array】js中更短的 Array 类型转换-类型转换
- 【append】append和appendTo的区别以及appendChil
- 【ExtJs】ExtJs 表单提交登陆实现代码-表单提交-
- 【ajax清除浏览器缓存】Ajax清除浏览器js、css、
- 【addClass】javascript自定义的addClass()方法
- 评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
-