1.document.getElementById(elementId) 通过标签的id属性查找标签dom对象，elementId是标签的id属性 2.document.getElementsByName(elementName) 通过标签的name属性查找标签dom对象，elementName是标签的name属性值 3.document.getElementsByTagName(tagname) 通过标签名查找标签dom对象，tagname是标签名 4.document.createElement(tagname) 通过给定的标签名，创建一个标签对象，这个对象创建完成后还是在内存里面，我们需要把它放在指定的标签里面所有我们一般要配合appendChild() 或 insertBefore()方法使用，tagname是标签名
document.getElementById(elementId) document.getElementById(elementId)可以获取指定id的标签，当多个id相同，则永远只会获取到第一个所指定id的标签 问题描述： 当用户点击了校验按钮要获取输入框中的内容，然后验证其是否合法。 验证规则： 必须要有字母，数字，下划线组成，且长度为5到12位
1.获取输入框中的内容
<body> <input type="text" id="12" value="0" /> <button onclick="b()">校检</button> </body>创建一个文本输入框用来给用户提供输入；id为12；默认值为0 创建一个校检按钮，加入onclick(点击发生事件)属性
function b(){ var obj=document.getElementById("12"); alert(obj.value); }b()函数，用obj=document.getElementById("12")获取到id为12的标签，然后obj.value可以返回obj对象(即id为12的文本输入框标签)，框中的值
2.验证字符串符合规则 需要用到正则表达式的技术 正则表达式知识内容请移至 正则表达式技术
var a=obj.value; var patt=/^\w{5,12}$/; alert(patt.test(a));定义一个变量a接收输入框内的返回值，然后判断a是否符合规则 然后提示
document.getElementsByName(elementName) 问题描述： 创建一个多选，并创建一个全选，一个反选，一个全不选按钮 首先有这么一个多选框和三个按钮
<body> 兴趣爱好： <input type="checkbox" name="hobby" value=java />java <input type="checkbox" name="hobby" value=hadoop/>hadoop <input type="checkbox" name="hobby" value=c++/>c++ <input type="checkbox" name="hobby" value=c/>c <br /> <button onclick="a()">全选</button> <button onclick="b()">全不选</button> <button onclick="c()">反选</button> </body> var obj=document.getElementsByName("hobby");查找name为hobby的标签，同时返回他们的dom对象，返回值是多个标签的dom对象的集合 即此时obj是一个集合，里面有所有的name为hobby的dom对象。 这个集合的操作方法和数组一样，可以用数组的操作方法来对其操作。
obj[n]代表标签的dom对象 集合里面的顺序就是html中从上到下的顺序
alert(obj.length);//查找有几个元素 alert(obj[0].checked) //当某一项被选中，则它的checked=true选中是由checked=checked决定的 但是只要多选标签里面有checked，不管其值是多少，初始这项都会被选中
选中对象的checked属性并对其进行操作 当某一项被选中，则它的checked=true，当他未被选中则其checked=false。 标签的checked属性可被改变 我们可以用这个对其是否选中状态进行操作 obj[0].checked=true使第一个元素进入选中状态 obj[0].checked=false使第一个元素进入不选中状态 代码如下
var obj=document.getElementsByName("hobby"); function a(){ var i=0; while(i<4){ obj[i].checked=true; i++; } } function b(){ var i=0; while(i<4){ obj[i].checked=false; i++; } } function c(){ var i=0; while(i<4){ if(obj[i].checked){ obj[i].checked=false; }else{ obj[i].checked=true; } i++; } }document.getElementsByTagName(tagename) 问题描述： 通过input标签获取到所有的input标签对象，并创建一个按钮，点击按钮可获取他们所有的默认值 注：input type=“text” 获取到的默认值是文本框里面的数值
<body> <input type="checkbox" value=java />java <input type="checkbox" value=hadoop />hadoop <input type="checkbox" value=c++ />c++ <input type="checkbox" value=c />c <br /> <button onclick="b()">全选</button> </body>创建多选项和按钮
function b(){ var obj=document.getElementsByTagName("input"); //获取到input标签对象的集合 alert(obj[0]); var i=0; do{ console.log(obj[i].value); i++ }while(i<4); }document.getElementsByTagName("input")按照括号中的标签名进行查找,返回值也是符合条件的dom对象集合 其操作方法和数组一样 集合中元素顺序还是他们在html页面中从上到下的顺序
document.createElement(tagname) 问题描述：使用js代码来创建html标签，并显示在页面上，标签内容：<div>阿涵，你真帅</div> 解决步骤： 1.创建div对象 2.向div里面加入值 3.把整个div对象放在body里面
window.onload=function(){ //1.创建div对象 var obj=document.createElement("div"); //2.向div里面加入值 obj.innerHTML="阿涵，你真帅"; //3.把整个div对象放在body里面 document.body.appendChild(obj); }当创建完对象时他是在内存中的，不在html的body中，所以配合document.body.appendChild(obj)把它放在body中
三个方法的优先使用顺序： 如果有id我们优先使用document.getElementById(elementId)，没有id但有name优先使用document.getElementsByName(elementName)，id，name都没有，那我们用document.getElementsByTagName(tagename) 注意： 这三个方法，一定要在页面加载完成之后执行，才能查询到标签对象。即，整个页面代码读取完成，形成一个dom模型，这个时候查询才能有效。所以这些查询代码需要写在函数里面供其他代码调用，或者写在window.onload=function(){}这些页面加载响应后才执行的函数里面才能有用。
