操作元素

1.改变元素内容：

从起始位置到终止位置的内容,但它去除 html标签，同时空格和换行也会去掉

起始位置到终止位舌的全部内容，包括html标签，同时保留空格和换行

一个案例：

分时问候：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        img {
            width: 300px;
        }
    </style>
</head>

<body>
    <img src="img/111.jpg" alt="">
    <div>上午好</div>
</body>
<script>
    // 1.获取元素
    var img = document.querySelector('img')
    var div = document.querySelector('div')
    // 2.获取当时小时数
    var date = new Date()
    var h = date.getHours();
    // 3.判断小时数改变图片和文字信息
    if (h < 12) {
        img.src = 'img/111.jpg'
        div.innerHTML = '上午好'
    } else if (h < 18) {
        img.src = 'img/222.jpg'
        div.innerHTML = '下午好'
    } else {
        img.src = 'img/333.jpg'
        div.innerHTML = '晚上好'
    }
</script>

</html>

 

posted @ 2022-04-09 09:43  今天穿秋裤了吗  阅读(17)  评论(0)    收藏  举报