首页 > 编程语言 > 详细

网页 JavaScript的DOM操作

时间:2016-08-16 17:31:26      阅读:217      评论:0      收藏:0      [点我收藏+]

  今天,我首先对之前学习的内容进行了复习,然后学习了当鼠标指向某一个按钮时,切换对应的背景图片。

  <div id="d1">
  </div>
  <input type="button" value="1" onmouseover="dj1()" id="j1" class="c1" style="background-color:#6F3"/>
  <input type="button" value="2" onmouseover="dj2()" id="j2" class="c1"/>
  <input type="button" value="3" onmouseover="dj3()" id="j3" class="c1"/>

  

<script>
  var a=document.getElementById("j1");
  var b=document.getElementById("j2");
  var c=document.getElementById("j3");
  function dj1()
  {
    var aa=document.getElementById("d1");
    aa.style.backgroundImage="url(6UPCKHIN3K5O0006.jpg)";
    a.style.backgroundColor="#6F3";
    b.style.backgroundColor="#CCC";
    c.style.backgroundColor="#CCC";
  }
  function dj2()
  {
    var aa=document.getElementById("d1");
    aa.style.backgroundImage="url(22.jpg)";
    a.style.backgroundColor="#CCC";
    b.style.backgroundColor="#6F3";
    c.style.backgroundColor="#CCC";
  }
  function dj3()
  {
    var aa=document.getElementById("d1");
    aa.style.backgroundImage="url(002-1.jpg)";
    a.style.backgroundColor="#CCC";
    b.style.backgroundColor="#CCC";
    c.style.backgroundColor="#6F3";
  }
</script>

  之后,我学习了利用Window.document操作内容、样式和属性。

  alert(a.innerHTML);标签里的html代码和文字都获取了

  a.setAttribute("属性名","属性值");设置一个属性,添加或更改都可以;

  a.getAttribute("属性名");获取属性的值;

  a.removeAttribute("属性名");移除一个属性;

网页 JavaScript的DOM操作

原文:http://www.cnblogs.com/hongsen3/p/5777166.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!