本文共 1133 字，大约阅读时间需要 3 分钟。

DOM操作

1.认识DOM

文档对象模型DOM（Document Object Model）定义访问和处理HTML文档的标准方法。DOM将HTML文档呈现为带有元素、属性和文本的属性结构（节点树）

将HTML代码分解为DOM节点层次图：

2.通过ID获取元素

网页由标签将信息组织起来，而标签的id属性值是唯一的，就像是每人有一个身份证号一样，只要通过身份证号就可以找到相对应的人。那么在网页中，我们通过id先找到标签，然后进行操作。

语法: document.getElementById(“id”)

3.获取或替换HTML元素的内容

innerHTML属性用于获取或替换HTML元素的内容。

语法:Object.innerHTML

注意:

（1）Object是获取的元素对象，如通过document.getElementById("ID")获取的元素。

（2）注意书写，innerHTML区分大小写。

4.改变HTML样式

HTML DOM 允许 JavaScript 改变 HTML 元素的样式。如何改变 HTML 元素的样式呢？

语法:Object.style.property=new style;

注意:Object是获取的元素对象，如通过document.getElementById("id")获取的元素。

5.显示和隐藏

网页中经常会看到显示和隐藏的效果，可通过display属性来设置。

语法：Object.style.display = value

注意:Object是获取的元素对象，如通过document.getElementById("id")获取的元素。

value的取值：（1）none：此元素不会被显示（2）block：此元素将显示为块级元素

6.控制类名

className 属性设置或返回元素的class 属性。

语法：

object.className = classname

作用:

（1）获取元素的class 属性

（2）为网页内的某个元素指定一个css样式来更改该元素的外观

 程序：

     
JavaScript课程
  
   
      
    
JavaScript为网页添加动态效果并实现与用户交互的功能。
        
    
1. JavaScript入门篇，让不懂JS的你，快速了解JS。
        
    
2. JavaScript进阶篇，让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。
        
    
3. 学完以上两门基础课后，在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。
  
   
  
   
  
        
          
        
        
        
      
   
  

转载地址：https://codingchaozhang.blog.csdn.net/article/details/77427603 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！