4.1 document对象

不羁的心 提交于 2020-03-21 11:32:26

找元素:

<head>
         <style type="text/css">
          </style>
</head>
<body>   
    windows对象   对窗口进行操作
   <div id="a">document对象    对html文档内容进行操作</div>
   <span class="b">这是元素</span>
   <span class="b">这是元1素</span>
   <span class="b">这是元素2</span>
   <input type="button" value="按钮" name="c"  />
</body>
<script type="text/javascript">
     找元素:
      ①ID找元素
      var a = document.getElementById("a");
      alert(a)
      ②class找元素
      var b = document.getElementsByClassName("b");
      alert(b[1])     
      ③标签名找元素
      var c = document.getElementsByTagName("span");
      alert(c[1])
      ④表单元素通过name找元素
      var d = document.getElementsByName("c");
      alert(d[0]);
</script>

id找元素class找  表单name找元素

操作内容:

<head>
         <style type="text/css">
          </style>
</head>
<body>   
    windows对象   对窗口进行操作
   <div id="a">document对象    对html文档内容进行操作</div>
   <div id="e"><span>document对象    对html文档内容进行操作</span></div>
   <span class="b">这是元素</span>
   <span class="b">这是元1素</span>
   <span class="b">这是元素2</span>
   <input type="button" value="按钮" name="c"  />
</body>
<script type="text/javascript">
 操作
 操作内容
 找到元素:
      var a = document.getElementById("a");
获取内容:  
      alert(a.innerText);
修改内容:
      a.innerText = "修改的内容";

获取内容(含标签):
     alert(e.innerHTML);
修改内容:
      e.innerHTML ="<b>这是修改的带有标签的内容</b>";

      
</script>

 获取内容 修改内容前修改内容后含标签修改内容

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!