0

我想创建函数以将任何属性或函数应用于所有选择器什么是正确的方法

function applyToAll(elm,func)
  {
   let i = elm.length; while (i--) { elm[i].func; }
  }

  li = document.querySelectorAll("li");
  hide = style.display = "none";

  applyToAll(li,hide) // Uncaught ReferenceError: style is not defined

我可以像这样直接传递属性

let i = elm.length; while (i--) { elm[i].style.display = "none"; }

但我想让函数动态,所以我可以使用例如:

prop = innerHTML = "<b>something</b>";
let i = elm.length; while (i--) { elm[i].prop }
4

2 回答 2

2

两个变化:

function applyToAll(elm, func) {
    let i = elm.length;
    while (i--) {
        func(elm[i])  // <---
    }
}

li = document.querySelectorAll("li");
hide = e => e.style.display = "none";  // <---


applyToAll(li, hide)

变化1:func不是方法,不能用点调用

变化 2:juststyle.display = ...是一个立即计算的表达式,另一方面,e => e.style.display是一个在调用时计算的函数。

作为旁注,querySelectorAll返回一个NodeList已经提供的forEach,这正是你的函数所做的,直到应用程序的顺序。

于 2021-04-01T22:29:45.347 回答
0

从评论说的和我看到的来看,我认为你的hide变量是为了包含一个箭头函数。

它应该被重写(如评论中所示)。

hide = e => e.style.display = "none";

此外,作为func参数的参数不绑定到传入的元素,它作为函数的参数之一绑定到变量(在这种情况下,它包含hide.

此外,您还必须使用 调用函数()。否则,在您的上下文中几乎没有任何意义。

所以,在你的 while 循环中,改变这个:

elem[i].func;

对此:

func(elem[i]);

这会将您的函数作为回调执行,并将元素作为参数传递。

还有一件事:因为我没有看到 hide 在其他任何地方声明(或为此重新声明),如果后者是真的,那么我建议使用const变量声明关键字。

因此,您的隐藏函数声明语句应更改为:

const hide = e => e.style.display = "none";

这告诉解释器您正在声明一个变量。

虽然在技术上(在非严格模式下),通常可以接受省略变量声明关键字但这是不好的做法。

有关更多信息,请参阅:var 关键字的用途是什么以及我应该何时使用它(或省略它)?

您似乎也遇到了箭头功能的问题。

我建议阅读本文以消除对箭头函数如何使用/形成的任何混淆。

于 2021-04-01T22:33:11.840 回答