DOM基础1-30 编程练习

最新推荐文章于 2022-07-13 14:44:22 发布

请叫我二狗哥

最新推荐文章于 2022-07-13 14:44:22 发布

阅读量393

点赞数

CC 4.0 BY-SA版权

分类专栏： Javascript 基础案例文章标签： DOM基础

cnblog博客：https://www.cnblogs.com/f6056/

本文链接：https://blog.youkuaiyun.com/weimob258616/article/details/90138340

Javascript 同时被 2 个专栏收录

57 篇文章

订阅专栏

基础案例

39 篇文章

订阅专栏

本文通过一个具体的编程练习，详细介绍了如何使用JavaScript删除HTML元素的样式属性，包括ID和类，实现对页面P标签样式的一次性清除。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1-30 编程练习

小伙伴们，今天我们学习了删除对象属性的方法，那么接下来用删除对象属性的方法把预设代码中P标签的样式全部去掉。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>dom属性的移除</title>
    <style type="text/css">
       .p1{background-color:pink;}
       #p1{color:green;}
       #p2{color:orange;}
       #p3{color:blue;}
    </style>
</head>
<body>
    <p class="p1" id="p1">
        一个人的快乐，不是因为他拥有的多，而是因为他计较的少。 
    </p>
    <p class="p1" id="p2">
        静坐常思己过，闲谈莫论人非，能受苦乃为志士，肯吃亏不是痴人，敬君子方显有德，怕小人不算无能，退一步天高地阔，让三分心平气和，欲进步需思退步，若着手先虑放手，如得意不宜重往，凡做事应有余步。
    </p>
    <p class="p1" id="p3">
       持黄金为珍贵，知安乐方值千金，事临头三思为妙，怒上心忍让最高。切勿贪意外之财，知足者人心常乐。若能以此去处事，一生安乐任逍遥。
    </p>
    <script type="text/javascript">
        // 补充代码
  
    </script>
</body>
</html>

任务

第一步：通过标签名获取元素的方式先获得到P标签的集合

第二步：将P标签的字体样式去掉

第三步：将P标签的背景颜色去掉

Tips：

用循环的方式进行删除样式

参考答案：

        var alP=document.getElementsByTagName("p");
        for(var i=0;i<alP.length;i++){
            alP[i].removeAttribute("id");
            alP[i].removeAttribute("class");
        }