DOM
实例:
1、点击页面‘+1’按钮后,使页面上显示的数字加1
<body> <div> <div id="num">1</div> <input type="button" value="+1" onclick="add();"/> <!--点击button后,执行onclick后面的函数--> </div> <script type="text/javascript"> function add(){ //定义add()函数 var nid = document.getElementById(‘num‘); //获取id为num var text = nid.innerText; //获取标签的文本值 text = parseInt(text); //字符串转换成整型 text +=1; nid.innerText=text; //更改num的值 } </script> </body>
innerTEXT与innerHTML:
innerTEXT获取的是两个标签之间的纯text文本,不包含这其中的html标签
innerHTML获取的是两个标签之间的所有的内容,包括text和html标签
对于用户输入或选择的值,获取其中的值时使用value。
2、获取input 输入值
<div> <input type="text" id="in1"/> <input type="button" value="getvalue" onclick="getvalue();"/> </div> <script type="text/javascript"> function getvalue(){ var obj = document.getElementById(‘in1‘); alert(obj.value); } </script>
3、搜索框实例
<div> <input type="text" id="in2" value="input your search:" onfocus="Focus();" onblur="Blur();"/> </div> <script type="text/javascript"> function Focus(){ var nid = document.getElementById(‘in2‘); var value = nid.value; if(value == ‘input your search:‘){ nid.value = ‘‘; } } function Blur(){ var nid = document.getElementById(‘in2‘); var value = nid.value; if(value.trim()== ‘‘){ //.trim()去空格 nid.value = ‘input your search:‘ } } </script>
原文:http://www.cnblogs.com/ahaii/p/5527952.html