求助排查：getElementsByTagName报is not a function错误

哦，这个坑我之前也踩过！你代码里的d根本不是你以为的document，而是浏览器触发load事件时传入的Event对象——Event对象没有getElementsByTagName方法，自然会报错“不是函数”。

具体为啥会这样？ #

咱们一步步拆解：

1. 你定义的main函数参数是(w, d)，原本期望w是window，d是document；
2. 但bind()的规则是：第一个参数是绑定的this值（这里你传的是window），后面的参数是提前塞给main函数的第一个参数；
3. 当load事件触发时，浏览器会自动把Event对象作为回调的第二个参数传给main；
4. 所以此时main里的参数实际是：
   • w = 你预设的document
   • d = load事件的Event对象

不信你可以在main里加一行console.log(d instanceof Event)，肯定输出true！

怎么修复？ #

给你两种简单靠谱的方案：

方案1：改用箭头函数传递参数（最直观）

直接绕开bind的参数顺序问题，手动把window和document传给main：

window.addEventListener("load", () => main(window, document));

这样参数传递完全符合你的预期，不会有任何歧义。

方案2：调整bind的参数匹配main的定义

如果你非要用bind，可以修改main的参数，或者调整bind的参数：
比如简化main的参数，只接收document（因为你其实没用到w）：

function main(d) {
 console.log(d); // 现在d是document了
 const CANVAS = d.getElementsByTagName("canvas")[0];
 console.log(CANVAS);
}
window.addEventListener("load", main.bind(window, document));

或者保持main的参数，把window和document都通过bind预设（因为load事件的event参数你不需要）：

window.addEventListener("load", main.bind(window, window, document));

这样main里的w就是window，d就是document，完美匹配你的初始意图。

内容的提问来源于stack exchange，提问作者ESCM