遇见的问题_js 的class 方法不执行-优快云博客

本文链接：https://blog.youkuaiyun.com/m0_75112012/article/details/143834761

this和不用this

循环变量 i 在事件处理器被调用时已经没有意义，因为它已经完成了它的循环。

for (var j = 0; j < aA.length; j++) {

aA[j].onclick = function () {

aA[j].parentNode.style.display = ‘none’;

}

}为什么只能用 this.parentNode.style.display = ‘none’;才会生效

在这个代码块中，for 循环遍历数组 aA，为每个元素设置一个点击事件处理器。然而，当点击事件实际发生时，循环已经结束，变量 j 的值已经是 aA.length（即数组 aA 的长度，一个超出数组索引的值）。因此，当你尝试访问 aA[j] 时，实际上是在访问一个不存在的元素（undefined），从而导致错误。

使用 this 关键字可以解决这个问题，因为 this 在事件处理器中指向触发事件的元素（即 aA[j] 中的某个元素）。因此，this.parentNode 正确地引用了该元素的父节点，你可以安全地修改其 display 样式。

兼容性问题，if语句

if (oUl.firstElementChild) {

oUl.firstElementChild.style.background = ‘blue’;

}

else {

oUl.firstChild.style.background = ‘blue’;

}

文本不换行

文从单个字之间换行，英文保留单词的完整性，超出单词会溢出。当设定为overflow-wrap: break-word;是：英文保留单词的完整性，但超长单词会中单词中间截断换行。当设定为word-break: break-all;是：认为英文文本的最小单位是字符，而不是单词，换行时不保留单词的完整。

word-break

从这个名字可以知道，这个属性是控制单词如何被拆分换行的。

word-wrap又叫做overflow-wrap：

word-wrap 属性原本属于微软的一个私有属性，在 CSS3 现在的文本规范草案中已经被重名为 overflow-wrap 。 word-wrap 现在被当作 overflow-wrap 的 “别名”。稳定的谷歌 Chrome 和 Opera 浏览器版本支持这种新语法。

white-space，控制空白字符的显示，同时还能控制是否自动换行。它有五个值：normal | nowrap | pre | pre-wrap | pre-line
word-break，控制单词如何被拆分换行。它有三个值：normal | break-all | keep-all
word-wrap（overflow-wrap）控制长度超过一行的单词是否被拆分换行，是word-break的补充，它有两个值：normal | break-word
word-break:keep-all：所有“单词”一律不拆分换行，注意，我这里的“单词”包括连续的中文字符（还有日文、韩文等），或者可以理解为只有空格可以触发自动换行
word-break:break-all：所有单词碰到边界一律拆分换行，不管你是incomprehensibilities这样一行都显示不下的单词，还是long这样很短的单词，只要碰到边界，都会被强制拆分换行。

let和var

var对for循环的影响

this的使用

定时器—全局变量

var timer = null; 这行代码被放在了全局作用域中（即在任何函数外部），这意味着timer变量在整个脚本中都是可访问的。这是为了确保每次调用move()函数时，都能访问到同一个timer变量，从而能够正确地清除之前设置的定时器（如果有的话）。

如果你将var timer = null;放在move()函数内部，那么每次调用move()时，都会创建一个新的局部变量timer，这个局部变量在函数执行完毕后就会被销毁。这样，当你尝试在move()函数内部使用clearInterval(timer);来清除定时器时，由于每次调用move()都会创建一个新的timer变量，所以之前的定时器引用就会丢失，导致无法正确清除定时器。

简单来说，将var timer = null;放在全局作用域中是为了：

确保timer变量在多次调用move()函数时保持同一个引用。
允许在move()函数内部正确地清除之前设置的定时器。

缓冲运动

缓冲运动要取整

计算机乘法不一定正确

Math.round( ) 四舍五入取整

`document.onmousemove = mousemove(e)` 的问题

在 JavaScript 中，document.onmousemove = mousemove(e) 这种写法会遇到几个问题，主要是因为它试图立即调用 mousemove 函数，而不是将函数本身赋值给 onmousemove 事件处理器。让我们逐一分析这些问题：

立即调用函数：
当你写 mousemove(e) 时，你实际上是在尝试调用 mousemove 函数，并将返回值（如果有的话）赋给 document.onmousemove。因为这是在代码执行时立即发生的，并没有考虑到事件对象 e 在实际事件触发时才会被创建和传递。因此，这里的 e 是未定义的，或者更准确地说是当前作用域下的一个未初始化变量，这会导致运行时错误（通常是 e is not defined）。
正确的事件处理器赋值：
正确的方式是将函数引用（而不是函数调用的结果）赋给事件处理器。你应该直接写函数名（不带括号），如 document.onmousemove = mousemove;。这样，当鼠标移动事件发生时，浏览器会自动调用 mousemove 函数，并传递一个事件对象作为参数。
使用括号 () 表示立即调用 mousemove 函数。这意味着在将 mousemove 的返回值赋给 document.onmousemove 之前，mousemove 函数已经被执行了一次。这通常不是您想要的效果，因为您希望 mousemove 函数在鼠标移动时执行，而不是在页面加载时。