15 Uncaught TypeError: Cannot set properties of null (setting ‘onclick‘)
1、报错的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>标题</title>
<style type="text/css"> </style>
<script type="text/javascript">
//获取button对象
var btn = document.getElementById("btn");
//为按钮的对应事件绑定处理函数的形式来响应事件，当事件被触发时，对应的函数将会被调用
btn.onclick = function () {
alert("触发了点击事件");
};
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
btn1.onclick = function () {
document.getElementById("t2").value = document.getElementById("t1").value
};
btn2.onclick = function () {
document.getElementById("t2").value = ""
}
</script>
</head>
<body>
<button id="btn">我是按钮</button>
<br><br>
<input id="t1" type="text" value="文本1">
<input id="t2" type="text">
<button id="btn1">copy</button>
<button id="btn2">取消</button>
</body>
</html>
2：报错的原因
文档的加载过程是自上向下加载。使用未命名的变量、会报错
3、解决办法
1、将Javascript代码从<head>标签中放入<body>中
2、如果非要将该段代码放入到head标签中该怎样做？？？
修改后的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>标题</title>
<style type="text/css"> </style>
<script type="text/javascript">
window.onload = function(){
//获取button对象
var btn = document.getElementById("btn");
//为按钮的对应事件绑定处理函数的形式来响应事件，当事件被触发时，对应的函数将会被调用
btn.onclick = function () {
alert("触发了点击事件");
};
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
btn1.onclick = function () {
document.getElementById("t2").value = document.getElementById("t1").value
};
btn2.onclick = function () {
document.getElementById("t2").value = ""
}
}
</script>
</head>
<body>
<button id="btn">我是按钮</button>
<br><br>
<input id="t1" type="text" value="文本1">
<input id="t2" type="text">
<button id="btn1">copy</button>
<button id="btn2">取消</button>
</body>
</html>
15 Uncaught TypeError: Cannot set properties of null (setting ‘onclick‘)的更多相关文章
- Vue 报错Error in render: “TypeError: Cannot read properties of null (reading ‘xxx’)” found in
前端vue报错 [Vue warn]: Error in render: "TypeError: Cannot read properties of null (reading 'name' ...
- vue报错 Uncaught TypeError: Cannot read property of null
有可能是点击a标签,但是a标签有click事件,未阻止默认事件导致报错,开始都看不出来是什么错误
- Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol')
Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol') 报错信 ...
- Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null
在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...
- Uncaught TypeError: Cannot set property 'innerHTML' of null
学习Chrome插件时,要在弹出页面中显示当前时间,结果怎样也显示不出来 看了 http://www.cnblogs.com/mfryf/p/3701801.html 这篇文章后感悟颇深 通过调试发现 ...
- Three.js three.js Uncaught TypeError: Cannot read property 'getExtension' of null
在调试Three.js执行加载幕布的时候,突然爆出这个错误three.js Uncaught TypeError: Cannot read property 'getExtension' of nul ...
- JavaScript Uncaught TypeError: Cannot read property 'value' of null
用 JavaScript 操作 DOM 时出现如下错误: Uncaught TypeError: Cannot set property 'value' of null Uncaught TypeEr ...
- 前台报错:Uncaught TypeError: Cannot read property '0' of null
错误现象: var div1=mycss[0].style.backgroundColor; //这一行提示360和chrome提示:Uncaught TypeError: Cannot read ...
- 解决sweetalert 无故报错 elem.className.replace Uncaught TypeError: Cannot read property 'className' of null
今天碰到这么一个问题,在使用sweetalert的时候时有时无会报错 elem.className.replace Uncaught TypeError: Cannot read property ' ...
随机推荐
- C++ 虚拟桌面
C++ 打开一个虚拟桌面的代码 看不明白的地方 请查看demo: http://download.csdn.net/detail/allh45601/7224205 QQ群:103197177 C++ ...
- 漏洞扫描工具awvs13破解
AWVS13_windows破解版:链接:https://pan.baidu.com/s/1qeGiNubhWgY6oeMx_IkMtg 提取码:2i2o AWVS13_linux破解版:链接:htt ...
- DL基础：cs231n assignment 1
cs231n assignment 1 20210804 - 20210808. 目录 cs231n assignment 1 总结 KNN 思想 cross-validation 编程细节 SVM ...
- vue2和vue3的区别？
vue2和vue3的主要区别在于以下几点: 1.生命周期函数钩子不同 2.数据双向绑定原理不同 3.定义变量和方法不同 4.指令和插槽的使用不同 5.API类型不同 6.是否支持碎片 7.父子组件之间 ...
- 二 代理模式【Proxy Pattern】 来自CBF4LIFE 的设计模式
什么是代理模式呢?我很忙,忙的没空理你,那你要找我呢就先找我的代理人吧,那代理人总要知道被代理人能做哪些事情不能做哪些事情吧,那就是两个人具备同一个接口,代理人虽然不能干活,但是被代理的人能干活呀. ...
- XXL-JOB最佳实践与升级指南
前言: xxl-job是国内一款使用者比较多的分布式任务调度平台,我们内部从19年开始使用该款开源软件,使用的是2.0.1版本,并在此基础上做了二次开发,添加了一些定制化的功能.随着使用该定时器的业务 ...
- 典型C内存空间分布图
下图是一个典型的C内存空间分布图 这是Linux下32位环境的用户空间内存分布情况 内核空间 :一部分核心软件独立于普通应用程序,运行在较高的特权级别上,驻留在被保护的内存空间上,拥有访问硬件设备的所 ...
- vue中处理过内存泄露处理方法
1>意外的全局变量函数中意外的定义了全局变量,每次执行该函数都会生成该变量,且不会随着函数执行结束而释放. 2>未清除的定时器定时器没有清除,它内部引用的变量,不会被释放. 3>脱离 ...
- iNeuOS工业互联网操作系统，面向4个领域颁发第一批技术认证资质
为了更好的紧密合作.利益多赢和共建生态.iNeuOS工业互联网操作系统面向:仪器仪表.双碳环保.核能科学与工程和钢铁冶金领域颁发第一批技术认证资质,一共21名同志在项目实施过程中表现突出,从iNeuO ...
- LVGL 入门使用教程
一.准备资料 开发板:ESP32-S3 开发环境:VS Code + PlatformIO 串口屏驱动 TFT-eSPI:https://github.com/Bodmer/TFT_eSPI 触摸驱动 ...