页面之所以是动态的，其实不仅仅是因为他是具有js的动态效果的，还有一部分是因为他的数据是动态的，所以页面才会显得很有活性，但是很多的时候获取数据是一个很恶心的事情，动不动就拿不到数据，作为一个前端，其实很大一部分时间也都是在处理数据，今天简单的将常见的几种获取数据的办法记录一下，不为别的，以后可以直接用，虽然简单的要死，但是还是记录一下比较好，说不定哪天脑子抽风忘记了....
源码：
代码语言：javascript复制<!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，最后获取的是所有的长度。
