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‘)的更多相关文章

  1. 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' ...

  2. vue报错 Uncaught TypeError: Cannot read property of null

    有可能是点击a标签,但是a标签有click事件,未阻止默认事件导致报错,开始都看不出来是什么错误

  3. Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol')

    Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol') 报错信 ...

  4. Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null

    在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...

  5. Uncaught TypeError: Cannot set property 'innerHTML' of null

    学习Chrome插件时,要在弹出页面中显示当前时间,结果怎样也显示不出来 看了 http://www.cnblogs.com/mfryf/p/3701801.html 这篇文章后感悟颇深 通过调试发现 ...

  6. Three.js three.js Uncaught TypeError: Cannot read property 'getExtension' of null

    在调试Three.js执行加载幕布的时候,突然爆出这个错误three.js Uncaught TypeError: Cannot read property 'getExtension' of nul ...

  7. JavaScript Uncaught TypeError: Cannot read property 'value' of null

    用 JavaScript 操作 DOM 时出现如下错误: Uncaught TypeError: Cannot set property 'value' of null Uncaught TypeEr ...

  8. 前台报错:Uncaught TypeError: Cannot read property '0' of null

    错误现象: var div1=mycss[0].style.backgroundColor;  //这一行提示360和chrome提示:Uncaught TypeError: Cannot read  ...

  9. 解决sweetalert 无故报错 elem.className.replace Uncaught TypeError: Cannot read property 'className' of null

    今天碰到这么一个问题,在使用sweetalert的时候时有时无会报错 elem.className.replace Uncaught TypeError: Cannot read property ' ...

随机推荐

  1. Apache DolphinScheduler ASF 孵化器毕业一周年,汇报来了!

    不知不觉,Apache DolphinScheduler 已经从 Apache 软件基金会(以下简称 ASF)孵化器毕业一年啦! 北京时间 2021 年 4 月 9 日,ASF 官方宣布 Apache ...

  2. Apache DolphinScheduler 1.2.1 发布说明

    Apache DolphinScheduler 于2020年2月24日正式发布 1.2.1 版,发布内容如下: 新特性: [#1497] 通过 API 创建的工作流在前端展示时自动调整布局. [#74 ...

  3. layui框架图片上传至服务器

    注意:只可用于数据量较小的项目,数据量庞大的项目不要用这个,否则会造成图片数量庞大,至服务器运行速度变慢或瘫痪 HTML代码 //前端使用的是layui框架<div class="la ...

  4. 《吐血整理》进阶系列教程-拿捏Fiddler抓包教程(12)-Fiddler设置IOS手机抓包,你知多少???

    1.简介 Fiddler不但能截获各种浏览器发出的 HTTP 请求,也可以截获各种智能手机发出的HTTP/ HTTPS 请求. Fiddler 能捕获Android 和 Windows Phone 等 ...

  5. identity4 系列————开篇概念

    前言 identity4 其实是openid connection, 那么我们还听说过openid 还有 oauth 2.0 那么下面就介绍一下Oath 2.0和openid 还有 openid co ...

  6. [游记]CSP 2021 J/S

    这一次,也许是我的OI生涯的转折点了--能过,学习OI的时间就不会减少:但不能过,就会减少学习OI的时间-- 上午(S组) 6:00起床.去吃早餐,结果因为边喝粥边喝牛奶导致肚子疼.(我在这里劝大家, ...

  7. Excel 统计函数(四):AVERAGEIF 和 AVERAGEIFS

    AVERAGEIF [语法]AVERAGEIF(range, criteria, [average_range]) [参数] range:要计算平均值的一个或多个单元格: criteria:筛选条件: ...

  8. C++ 添加程序图标到我的电脑

    C++ 像我的电脑中 百度网盘的 那图标快捷方式.如何生成的呢?设置程序图标到我的电脑 请看下边代码 就ok了(*^__^*) 嘻嘻-- 类似下图: 大家如果看我下边的不是很清楚,可以下载这个具体工程 ...

  9. [CSP-S 2019 day2 T1] Emiya家今天的饭

    题面 题解 不考虑每种食材不超过一半的限制,答案是 减去 1 是去掉一道菜都不做的方案. 显然只可能有一种菜超过一半,于是枚举这种菜,对每个方式做背包即可(记一维状态表示这种菜比别的菜多做了多少份). ...

  10. 【java】学习路径31-文件IO基本操作(未涉及到流)

    一.初始化: File f1 = new File("//Users//Shared//JavaIOTest//Test01.txt"); File f2 = new File(& ...