js事件及css和js常见错误

一.javascript事件

事件传递：

冒泡：最具体元素最先捕捉到事件，传递给最不具体的元素

捕获：最不具体的元素先捕获到事件，传递给最具体的元素

默认都是冒泡，使用捕获

elem.addEventlistener(事件类型，响应函数，是否为捕获)

elem.addEventlistener("click",doit,true)

event.stopPropagation();阻止事件传递

event.preventDefaule();阻止默认事件

例:

var  son = document.querySelector(".son");
			var  parent = document.querySelector(".parent");
			var  container = document.querySelector(".container");
			var a = document.querySelector("a");
			a.addEventListener("click",function(e){
				e.stopPropagation(); //阻止事件冒泡
				e.preventDefault();//阻止默认事件
				alert("哇,中奖了");
			})
			son.addEventListener("click",function(){
				alert("son被点击了")
			},false)
			parent.addEventListener("click",function(){
					alert("parent被点击了")
			},false)
			container.addEventListener("click",function(){
				alert("container被点击了")
			},false)
			// addEventListener(事件类型,响应的函数,是否使用捕获)
			// 捕获:事件最不具体的元素捕捉事件,传递给最具体的元素
			/* son.onclick = function(e){
				e.stopPropagation();
				// 阻止事件传递
				alert("son被点击了")
			}
			parent.onclick = function(){
				alert("pare
				nt被点击了")
			}
			container.onclick = function(){
				alert("container被点击了")
			} */
			// 最小的元素先监听到事件,然后传递给父元素监听:事件的冒泡机制

鼠标事件

mouseover 鼠标移入   mouseout 鼠标移出   mousedown 鼠标按下   mouseup 鼠标d起

mousemove 鼠标移动   click 鼠标单击   dblclick鼠标双击

键盘事件

keypass 当用户按下键盘上的字符键触发，如果按住不放，会重复触发

keyup 键盘松开

keydown 键盘按下

event.keycode 键盘对应数字编码

event.which 等于keycode

例：

	
		留言板
		
			
我是第一条默认留言
			
我是第二条留言
		
		
		
	

表单事件

change 值发生变化   inpu 真在输入

页面事件

load 加载   resize 窗口变化  scroll 滚动

事件代理

把事件注册到其共有的父元素上，通过事件的冒泡机制 event-target实现目标（本来注册给每个元素注册）

例：

	
		留言板
		
			
我是第一条默认留言
			
我是第二条留言
		
		
		
	

二.js和css常见错误

js常见错误：

 Uncaught TypeError: Cannot read properties of null (reading 'classList')

Uncaught 没有捕捉到

TypeError类型错误

Cannot 不能

read 读

properties 属性

of null null的

不能读取null的属性（reading ‘classList’）

reading读

classList 类列表

当读取null的classList属性了发送了类型错误

引起的原因: swiper选择适合没有选择到值就null（选择器填错了）

 

swiper.js出错了,还在第1行

uncaught没有捕捉到

SyntaxError 语法错误

Unexpected 不希望，不应该的

token符号

‘<’ 不应存在

引起原因:script的src 地址填错了,hbuilderx默认返回一个404的网页

js文件是个html待'<' 报错

 

未捕捉到引用错误:b 没有定义

（没有定义就去使用它了）

 

25行发生的错误

Uncaught 没有捕捉到

SyntaxError:语法错误

Invalid不合法的

or或者

Unexpected 不应该出现的

token字符

第25行语法错误,标点符号错误

script写过src属性的不能在里面放入代码

常见错误.html:20 Uncaught TypeError: swiper.clone is not a function

20行发生了错误

uncaught TypeError没有捕捉到类型错误

: swiper.clone is not a function

.swiper.clone不是一个函数

swiper没有clone方法 大概率方法名写错了

css常见错误

css //注释不管用

上一行发生错误,下一行css也不管用

 

如果审查元素,没有发现你的的css

css引入发生错误

css选择器发生错误

如果审查元素发现你写的css,被划掉了

被划掉带感叹号,css语法错误

单纯比划掉,选择器权限不够