JavaScript学习-DOM的简单学习

DOM的简单学习

功能:

控制html文档的内容

代码:

获取页面标签(元素)对象 Element
document.getElementById("id");通过元素id获取元素对象
<h1 id="h1">123456</h1>

<script>
    var h = document.getElementById("h1");
</script>

操作Element对象

1. 修改属性值
    (1)明确获取对象
    (2)查看API文档
2. 修改标签体内容:innerHTML
    (1)获取元素对象
    (2)使用innerHTML属性修改标签体内容

事件简单学习

功能:某些组件被执行某些操作后,触发某些代码的执行

如何绑定事件

1. 直接在html标签上,指定事件的属性(操作),属性值就是js代码
    事件:onclick--单击事件
2. js获取对象,指定事件属性,设置一个函数
<img src="/image/login.png" id="img1">
<img src="/image/add.png" id="img2" onclick="click2()">
<script>

    function click1(){
        alert("1被点了");
    }
    function click2(){
        alert("2被点了")
    }
    var image = document.getElementById("img1");
    image.onclick = click1();
</script>
上一篇:TypeScript 类型系统


下一篇:聊聊接口性能优化的11个小技巧