Javascript 在URL中按li或if#后更改宽度div

我已经编写了一个代码，当您按下所选的li键时，可以设置.line的宽度。我还想，如果url包含#first to give，请在元素#first的宽度上划线。为什么这个代码不起作用。请帮帮我

var set = document.querySelectorAll('li');
var line = document.querySelector('.line');

if(window.location.hash == "#first"){
  lineScale(document.querySelector('#first'));
};

for(i=0;i<set.length;i++)set[i].addEventListener('click',lineScale(el));
function lineScale(el){
  line.style.transform = 'scaleX(' + el.getBoundingClientRect().width + ')';
};

---

单击的事件侦听器至少有两个问题

一个是，您试图在添加事件时包含一个参数。这会阻止调用事件处理程序（因为处理程序是

lineScale

，而不是

lineScale（el）

）。其次，事件处理程序的第一个参数不是元素而是事件。您可以在事件处理程序中使用

this

，以引用事件发生的元素

因此：

这是因为，正如它所说，

el

并没有在该上下文中定义。解决该问题后，当您尝试将

el

参数作为元素引用时，开发人员控制台中会显示此错误：

Uncaught TypeError: el.getBoundingClientRect is not a function
    at HTMLLIElement.lineScale 

---

你可能有其他问题阻碍你实现你的最终目标，但这应该会让你走得更远，而不是解决所有的个人问题。如果您遇到其他问题，应将其作为单独的问题发布。

单击事件侦听器时，至少有两个问题

一个是，您试图在添加事件时包含一个参数。这会阻止调用事件处理程序（因为处理程序是

lineScale

，而不是

lineScale（el）

）。其次，事件处理程序的第一个参数不是元素而是事件。您可以在事件处理程序中使用

this

，以引用事件发生的元素

因此：

这是因为，正如它所说，

el

并没有在该上下文中定义。解决该问题后，当您尝试将

el

参数作为元素引用时，开发人员控制台中会显示此错误：

Uncaught TypeError: el.getBoundingClientRect is not a function
    at HTMLLIElement.lineScale 

---

你可能有其他问题阻碍你实现你的最终目标，但这应该会让你走得更远，而不是解决所有的个人问题。如果您遇到其他问题，应将其作为单独的问题发布。

首先，而不是

。addEventListener（'click'，lineScale（el））您应该有
.addEventListener（'click'，lineScale）
然后它会工作，但在两种情况下不会。@Yousaf如果只是一个错误，我就修复了代码。事件侦听器回调的第一个参数不是元素，而是事件。在回调函数内部，只需使用
this
引用所作用的元素：因此，
this.getBoundingClientRect（）.width
而不是
el.getBoundingClientRect（）.width
。window.location.hash呢？首先，不是
。addEventListener（'click'，lineScale（el））您应该有
.addEventListener（'click'，lineScale）
然后它会工作，但在两种情况下不会。@Yousaf如果只是一个错误，我就修复了代码。事件侦听器回调的第一个参数不是元素，而是事件。在回调函数内部，只需使用
this
引用所作用的元素：因此，
this.getBoundingClientRect（）.width
而不是
el.getBoundingClientRect（）.width
。window.location.hash呢？
for(i = 0; i < set.length; i++)
  set[i].addEventListener('click', lineScale);

function lineScale(){
  line.style.transform = 'scaleX(' + this.getBoundingClientRect().width + ')';
};

Uncaught ReferenceError: el is not defined

Uncaught TypeError: el.getBoundingClientRect is not a function
    at HTMLLIElement.lineScale