js事件绑定代码解析

<input type="button" value="按钮1" onclick="tan()"> <br> <input type="button" value="按钮2" id="btn"> <br>

事件绑定有两种方式:    

                                1. 通过 HTML标签中的事件属性进行绑定    

                                2. 通过 DOM 元素属性绑定 

<input type="button" value="按钮1" onclick="tan()">
<script>
    function tan() {
        alert('按钮一被点击了')
    }
</script>

这个按钮通过onclick属性绑定了一个点击事件。当用户点击这个按钮时，触发了名为tan()的JavaScript函数。在tan()函数中，调用了alert()函数弹出一个提示框，显示"按钮一被点击了"。

 document.getElementById(btn).onclick=function (){
        alert('按钮二被点击了')
    }
</script>

        <input type="button" value="按钮2" id="btn"> 这个按钮通过id属性设置了一个btn的唯一标识符，用于在JavaScript中找到这个按钮元素。 在JavaScript部分的代码中，通过document.getElementById(btn)来获取这个按钮的DOM元素，并且为它绑定了一个点击事件。当用户点击这个按钮时，触发了一个匿名函数，该函数内部调用alert()函数弹出一个提示框，显示"按钮二被点击了"。

        DOM（Document Object Model）元素指的是HTML文档中的各个标签元素，例如<div>、<p>、<span>等等。

        DOM提供了一种对HTML文档结构的表现方式，它将整个HTML文档构造成一个树形结构，每个元素（标签）都是树中的一个节点，节点之间存在父子关系（父节点和子节点），也可能存在兄弟关系。

        通过JavaScript可以操作DOM元素，例如获取元素、修改元素的内容或属性，添加、删除元素等等操作。可以通过DOM的API（Application Programming Interface）来实现与HTML文档的交互。

        通过DOM元素，我们可以通过其标识符（如id、class等）或其他属性来选择并定位元素，然后对其进行各种操作，实现动态改变页面内容、样式和行为的效果。

         <input>是DOM元素的一种。在HTML中，<input>用于创建用户输入的表单控件，例如文本字段、复选框、单选按钮等。

        作为DOM元素，<input>可以通过JavaScript来操作和访问。通过DOM API，可以使用document.querySelector()、document.getElementById()等方法获取<input>元素的引用，然后可以读取或设置其属性、值、样式等。例如，可以通过element.value来获取或设置输入框的值，通过element.checked来获取或设置复选框或单选按钮的选中状态。

        通过操作<input>元素，我们可以动态地获取用户输入或修改表单控件的状态，使得我们能够根据用户的交互行为做出相应的响应和处理。

        JSON（JavaScript Object Notation）对象是一种特定的数据结构，用于存储键值对。它是由花括号 {} 包裹的一组键值对，键和值之间使用冒号 : 分隔，不同的键值对之间使用逗号 , 分隔。 JSON主要用做数据载体，在网络中进行数据传输，跟js对象的主要区别就在于，JSON中的键必须是字符串类型     JSON数据的value部分，主要支持三种类型的数据：         1. 简单类型：数字、字符串、布尔、时间、null         2. 数组：使用 [] 表示，let studentName = ["张三","李四","王五"];         3. 对象：使用 {} 表示，let user = {"name":"Jerry","age":18};