
此项目需要安装Node.js和npm,还有express插件、body-parser插件。deepin下安装请参考Nodejs 中 GET 传输数据
**服务器端文件index.js:**
1. const express = require('express')
2. const bodyParser = require('body-parser')
3. // var 表示的是变量 值是可以改变的
4. // const表示常量一旦赋值就不能再改变
5. // cont是新特性 可以node中使用暂时不要在浏览器中使用
6. const app = express()
7.
8. app.use(express.static('public'))
9. app.use(bodyParser.urlencoded({extended:false}))
10. app.post('/user/login',function(req,res){
11. var phone = req.body.phone
12. var password = req.body.password
13. var result = password == '123456'?'登录成功':'密码错误'
14. res.send(result)
15. })
16.
17. app.listen(3000,()=>{
18. console.log('服务器运行了')
19. })
20. // (a,b)=>{
21. // return a +b
22. // }
23. // 都是匿名函数
24. // function(a,b){
25. // return a + b
26. // }
**html:**
1. <!DOCTYPE html>
2. <html lang="en">
3. <head>
4. <meta charset="UTF-8">
5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
6. <meta http-equiv="X-UA-Compatible" content="ie=edge">
7. <title>无刷新</title>
8. </head>
9. <body>
10. <form action="/user/login" method="post" target="result">
11. <input type="tel" name="phone" placeholder="请输入手机号">
12. <input type="password" name="password" placeholder="请输入密码">
13. <input type="submit" value="登录">
14. </form>
15. <iframe src="#" frameborder="0" id='result' name="result"></iframe>
16. <!-- 让表单刷新iframe而不是整个页面 从而达到无刷新的效果 -->
17. <script src="js/index.js"></script>
18. </body>
19. </html>
**客户端index.js**
1. var iframe = document.querySelector('#result')
2. iframe.onload = function(){
3. // contentWindow属性指定的iframe或者frame所在的window对象
4. var result = iframe.contentWindow.document.body.innerText
5. alert(result)
6. }