HTML5+JS：拖动元素

红影

马黑黑 发表于 2022-2-10 09:53
关于 obj 和 ”pic“标识：、

obj 是函数的参数，我用 object 这个单词的缩写，对象的意思，自定义的 ...

明白了，函数参数在实际运作时会被具体的数据替代，由event接管。
后面那个图片标识比较好理解，因为它一直被使用到。谢谢黑黑的耐心解说

马黑黑

红影 发表于 2022-2-10 16:53
“这些id标识我们的函数不去读取确切的名称，有就行。”

所以这个也是让人感觉绕的原因之一。

但是绕的好。我们批量生成一大堆的元素，很难去读取每一个元素的id，或读取的很繁琐，所以用 target.id 去调用挺好的，类似于匿名调用（但很精准，因为信息发自元素自身）。

马黑黑

红影 发表于 2022-2-10 16:59
明白了，函数参数在实际运作时会被具体的数据替代，由event接管。
后面那个图片标识比较好理解，因为它 ...

函数可以有参数，也可以没有。没参数的，函数后面是一对空的括号，有参数的，放在括号里，有些含有拥有多个参数。

函数参数的有无，根据需要设定。

红影

马黑黑 发表于 2022-2-10 16:52
代码并不长，函数也不多，就是方法、属性以及一些特定的命名可能陌生

是的，因为陌生，所以感觉很难。

红影

马黑黑 发表于 2022-2-10 16:53
是的哦

使用“拽个”，就拖过来了

红影

马黑黑 发表于 2022-2-10 17:00
但是绕的好。我们批量生成一大堆的元素，很难去读取每一个元素的id，或读取的很繁琐，所以用 target.id  ...

是为了忽略元素ID，虽然这样很方便，但太难理解了。

红影

马黑黑 发表于 2022-2-10 17:02
函数可以有参数，也可以没有。没参数的，函数后面是一对空的括号，有参数的，放在括号里，有些含有拥有多 ...

哦哦，也可以没参数的啊，嗯嗯，结合前面那条它可以忽略元素ID，倒是好理解了

马黑黑

红影 发表于 2022-2-10 19:14
哦哦，也可以没参数的啊，嗯嗯，结合前面那条它可以忽略元素ID，倒是好理解了

它可没有忽略元素的id哦，恰恰相反，元素的id是函数的标的，函数只是不在意元素的id名称。好比我养猪养的好发大财了，我要有所表示对社会回馈，我的做法是给学子发奖学金。这时，我会设定一个标准（它就是函数），针对特定的学子（比如在我母校就读的），符号这个条件就有领取奖金资格，但我不在意这个学子的其他条件（如姓什么叫什么）。换句话说，这些学生有id（例如姓名），他们必须有，但我不想去知道，我想知道的是他们在我的母校就读。

这个原理，其实已经涉及到了冒泡事件。JS的冒泡事件，由子级元素（比如学子个体）触发（我给他们每一个人发奖学金），唤醒父级元素（比如学校）的管理事件，泡泡冒的“水面”。依次原理，众多的子级元素，它们是否可以不必每一个个体都设计一个事件处理机制（即函数，我不必亲手将奖金一一发到他们手上），而是交由父级元素（学校）来统一处理并能达到奖金精准到位的目的？显然这是可行的，这也正是社会管理的现实运行机制。

于是，我把奖学金交由学校，指定通过 target.id 遍历每一个拥有id（学生证）的学子，将钱发到他们手上。

马黑黑

红影 发表于 2022-2-10 18:48
是的，因为陌生，所以感觉很难。

这个很正常，而且可以这么说，如果没能用上，仅仅看一看、略作了解，这种陌生感就不会本质上改变

红影

马黑黑 发表于 2022-2-11 08:07
它可没有忽略元素的id哦，恰恰相反，元素的id是函数的标的，函数只是不在意元素的id名称。好比我养猪养的 ...

嗯嗯，辛苦黑黑了，它不在意id的其他信息，但却要求id引向明确的时间。

冒泡事件，这个说法好玩

红影

马黑黑 发表于 2022-2-11 08:13
这个很正常，而且可以这么说，如果没能用上，仅仅看一看、略作了解，这种陌生感就不会本质上改变

跟车票似的，设定目的地，途径和出发站，然后由运输单位来根据票面允许行动，不管拿票的人长什么样

马黑黑

红影 发表于 2022-2-11 11:53
跟车票似的，设定目的地，途径和出发站，然后由运输单位来根据票面允许行动，不管拿票的人长什么样{:4_17 ...

对极了

马黑黑

红影 发表于 2022-2-11 11:49
嗯嗯，辛苦黑黑了，它不在意id的其他信息，但却要求id引向明确的时间。

冒泡事件，这个说法好玩{:4_17 ...

冒泡事件是所有高级编程语言都有的，最初用于数据排序。例如有这么一组数字：

6，8，78，29，88，100，2，69，1

现在按从小到大去给它们排序，人工去做没啥问题，但让电脑去做，得给它发指令。这个，用到循坏，通过两两相邻数字的比较，调整它们的位置，最终，通过N多次的循坏比较，最小的那个肯定能调整到最前方来。最小的那个假如是一个泡泡，它终于浮到最上方，这叫冒泡。程序员们把这个算法叫做冒泡算法。

冒泡算法学问一大把，不是行家里手，很难做出一个高效精准的算法。

而JS引入的冒泡则基于这样的理念，较好理解：

子级元素的触发行为不用每一个都绑定一个事件，统一使用一个事件绑定就行，这个事件绑定到父级元素，然后父级元素对子级元素的事件（比如单击事件）进行监视，一旦某个子级元素触发了操作事件，就由绑定到父级元素的绑定函数去处理，该过程通过 target.id 识别子级元素的身份，从而函数预设的工作能够精准无误地实现。

这里，子级元素的事件要求从底层冒出，直达父级元素，形同冒泡。

红影

马黑黑 发表于 2022-2-11 12:20
对极了

现在总算能更深地理解了，谢谢黑黑

红影

马黑黑 发表于 2022-2-11 12:34
冒泡事件是所有高级编程语言都有的，最初用于数据排序。例如有这么一组数字：

6，8，78，29，88，100 ...

冒泡算法还有这样的过程啊。
也就是子元素全部潜伏着，一旦触发了，父元素就去处理了。触发就是冒炮吧。

马黑黑

红影 发表于 2022-2-11 13:06
冒泡算法还有这样的过程啊。
也就是子元素全部潜伏着，一旦触发了，父元素就去处理了。触发就是冒炮吧。

子元素的单独等事件被触发，父元素只要有机制去监视，就会达成预设目的。而子元素是在底层的，相当于在水底下，事件触发了就会传导上来，形同冒泡。

红影

马黑黑 发表于 2022-2-11 13:19
子元素的单独等事件被触发，父元素只要有机制去监视，就会达成预设目的。而子元素是在底层的，相当于在水 ...

这个说法很形象

马黑黑

红影 发表于 2022-2-11 20:06
这个说法很形象

基本也就是这么解释的

红影

马黑黑 发表于 2022-2-11 20:31
基本也就是这么解释的

让人一下子就记住了，有趣。

马黑黑

红影 发表于 2022-2-11 21:03
让人一下子就记住了，有趣。

程序员基本都是风趣的