37 高级：MVC
2019-02-26 本文已影响0人
Ga611
课堂笔记
- 如何监听
<form>的提交事件
<body>
<form action="post" id='formID'>
<input type='text' name='content'>
<input type='submit' value='提交'>
</form>
<script>
var form = document.querySelector('#formID')
form.addEventListener('submit',function(x){
x.preventDefault()
console.log(form.querySelector('type[name=content]').value)
form.querySelector('type[name=content]').value = ''//在表单提交后清空其内容
})//注意此处监听的是<form>而不是<type>的'click'事件！
</script>
</body>
为什么不监听click 事件？因为仅监听'click'事件时，便无法监听用户使用回车提交的情况，监听<form>的'submit'事件可以同时监听用户回车和点击提交数据
-
MVC是什么（个人理解）
MVC是一种代码的组织模式，是三个单词的首字母缩写：model、view、controller
MVC模式认为，程序可以分为三层：顶层视图层，中间层控制层，最底层数据层
model就在最底层与服务器打交道，负责数据相关操作
view在最顶层负责视图的渲染
controller在中间层监听model与view的变化，并进行相关的操作
图转自《「每日一题」MVC 是什么？（续1）》——知乎方应杭
- 通过不同的文件名，来将不同功能的JS代码进行分块，便于管理。为避免全局变量的相互覆盖，要在不同的JS文件中使用立即执行函数，在立即执行函数内部要想声明一个全局变量，应使用
window.xxx的形式 - 箭头函数内部this没有特殊意义，就如同一个普通变量一样，会链式向上找父作用域内的this
- 不同的JS文件不代表是不同的作用域，不可用let重复声明变量
- 在对象内部的函数中使用this要特别小心，可能需要用
bind()绑定this -
onclickaddEventListener()这两个API的this是绑定事件的对象 - jQuery API
on()的this分两种情况：1.函数参数中没有选择器时，this指向绑定事件的对象 2.函数参数中有选择器时，this指向这个选择器选中的对象
