21、更新DOM节点

最新推荐文章于 2024-03-13 15:40:20 发布

工一木子

最新推荐文章于 2024-03-13 15:40:20 发布

阅读量167

点赞数

分类专栏： JavaScript学习文章标签： html css javascript

本文链接：https://blog.csdn.net/Prince140678/article/details/120285299

版权

JavaScript学习专栏收录该内容

30 篇文章 0 订阅

订阅专栏

更新节点

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id ="id1"></div>
    <script>
        var id1 = document.getElementById("id1");

    </script>
</body>
</html>

操作文本

id1.innerText=“456” 修改文本的值
id1.innerHTML=“123”; 可以解析HTML文本标签

操作css

id1.style.color='yellow';//属性使用字符串包裹
id1.style.fontSize ='20px';// - 转 驼峰命名问题
id1.style.padding='2em';

彩蛋

1.idea中新建HTML无自动缩进

解决方法：editor->code style->HTML->other->Do not indent children of
删掉这几项就可以了。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-OD2x5pRl-1631596849758)(D:\学习笔记\前端\JavaScript\21、更新DOM节点.assets\image-20210914131731117.png)]$

2.通过js操作百度首页“百度一下”的按背景颜色

在这里插入图片描述

核心代码：

var su = document.getElementById('su');
undefined
su.style.background('orange')
VM352:1 Uncaught TypeError: su.style.background is not a function
    at <anonymous>:1:10
(anonymous) @ VM352:1
su.style.backgroundColor='orange';
'orange'

工一木子

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
21、更新DOM节点

更新节点<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <div id ="id1"></div> <script> var id1 = document.getElement.
复制链接

扫一扫