window.onload匿名方法采坑

最新推荐文章于 2023-02-20 23:30:15 发布

入门有点晚

最新推荐文章于 2023-02-20 23:30:15 发布

阅读量509

点赞数

文章标签： javascript css3 html

本文链接：https://blog.youkuaiyun.com/weixin_45190226/article/details/122490105

版权

本文详细介绍了在JavaScript中遇到的window.onload使用问题，包括将JS代码置于window.onload函数内以确保DOM加载完毕后再执行，以及解释了错误地调用函数导致的问题。同时，文章讨论了如何正确绑定事件监听器，强调了在操作页面元素时必须确保元素已加载。此外，还介绍了span元素的行内和块级元素特性的转换及其CSS样式应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

业务需求描述：
1.点击button按钮向span节点中添加文本内容。
2.设置span节点的边框样式，背景颜色，宽度和高度。

下面是原始错误的代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>verification</title>
</head>
<style>
    #buttonObj{
   margin: 15px}
    .class1{
   display: block}
    .class2{
   border:1px solid red;width:200px;height:30px;background-color: #FFF68F}
</style>
<script>
    document.getElementById("buttonObj").onclick = function addText(){
   
        //创建文本内容
        let textStr = "span标签中的文本内容!";
        //创建文本节点
        let textNode = document.createTextNode(textStr);
        //货物span标签节点，并将文本节点赋值给span标签
        document.getElementById("spanObj").appendChild(textNode);
    }
</script