getElementById( ) 方法

Posted 乱舞春秋__

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了getElementById( ) 方法相关的知识,希望对你有一定的参考价值。

getElementById( ) 方法可以返回带有指定 ID 的元素。

语法格式:

document.getElementById('ID名称'); //获取带有指定ID名称的元素

示例:

使用getElementById()方法获取div元素,并为其设置宽度、高度、背景颜色和边框。

<!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>getElementById()方法</title>
</head>
<body>
    <div id="box"></div>
    <script>
        var box = document.getElementById('box'); //获取元素
        box.style.width = '200px'; //设置宽度
        box.style.height = '200px'; //设置高度
        box.style.backgroundColor = 'green'; //设置背景颜色
        box.style.border = '1px'+' solid' + ' #000'; //设置边框样式
        console.log(box);
    </script>
</body>
</html>

效果图:

控制台输出:

 

以上是关于getElementById( ) 方法的主要内容,如果未能解决你的问题,请参考以下文章

Document 对象中的方法介绍-getElementById-getElementsByName- getElementsByTagName 方法示例代码

VSCode自定义代码片段10—— 数组的响应式方法

Android课程---Android Studio使用小技巧:提取方法代码片段

jQ选择器学习片段(JavaScript 部分对应)

Sleep() 方法后的代码片段没有被执行

如何通过代码设置片段标签?