页面之所以是动态的，其实不仅仅是因为他是具有js的动态效果的，还有一部分是因为他的数据是动态的，所以页面才会显得很有活性，但是很多的时候获取数据是一个很恶心的事情，动不动就拿不到数据，作为一个前端，其实很大一部分时间也都是在处理数据，今天简单的将常见的几种获取数据的办法记录一下，不为别的，以后可以直接用，虽然简单的要死，但是还是记录一下比较好，说不定哪天脑子抽风忘记了....
源码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!--第一种 form层级取数据 --> <form name="test"> <input type="text" name="ftest" value="我是form层级取出来的数据"/><br /> </form> <!--dom操作name取数据--> <input type="text" name="test_name" value="我是操作dom的name取出来的数据"/><br /> <!--dom操作id取数据--> <input type="text" id="test_id" value="我是操作dom的id取出来的数据"/><br /> <!--Jquery根据class获取数据--> <input type="text" class="Jquery_class" value="我是jquery根据class取出来的数据"/><br /> <!--Jquery根据id获取数据--> <input type="text" id="Jquery_id" value="我是jquery根据id取出来的数据"/><br /> </body> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <script type="text/javascript"> window.onload = function(){ /*第一种*/ var test1 = document.test.ftest.value; console.log("第一种取出来的数据是："+test1); /*第二种*/ var test2 = document.getElementsByName("test_name"); console.log("第二种取出来的数据是："+test2.length); /*第三种*/ var test3 = document.getElementById("test_id").value; console.log("第三种取出来的数据是："+test3); /*第四种*/ var test4 = $(".Jquery_class").val(); console.log("第四种取出来的数据是："+test4); /*第五种*/ var test5 = $("#Jquery_id").val(); console.log("第五种取出来的数据是："+test5); } </script> </html>
PS：页面操作dom元素的时候，如果是操作的是name，那么是不可以直接拿到数据的，是因为页面上是允许多个name属性的，所以nana取得其实是元素，不是数据，也就是说您可以在一个页面上面写很多的name，最后获取的是所有的长度。
