Javascript:参考Div标签

Javascript: Refere to Div Tags

本文关键字：标签 Div 参考 Javascript      更新时间：2023-09-26

我有一个CSS样式表，它包含以下内容：

div.box img {
  width:100px;
  height:100px;
  border:1px solid;
  display:inline;
}

这个div标签基本上重新调整了我的图像大小。我的HTML文件有以下内容：

 <link rel="stylesheet" type="text/css" href="stylesheet.css" />
 <script type="text/javascript">
 function doMove(){
//move object
 }

 </script>
 </head>
 <body>
<h1>JavaScript Animation</h1>
<div class="box">
<img src="dp.png"/>
</div>

我希望在调用doMove((后能够将此框向左移动。如何在javascript中引用样式表中的DIV标记？

假设您只想要类名为box:的div

var divs = document.getElementsByTagName('div');
var divsNum = divs.length;
for (i=0; i<divsNum; i++){
    if (divs[i].className == 'box'){
        divs[i].style.marginLeft = '-100px';
    }
}

JS Fiddle演示。

如果您只是想移动那一个div，最简单的方法就是为该div分配一个id：

<div id="box1" class="box>

然后，要在javascript中引用该div，您需要执行以下操作：

var box1 = document.getElementById("box1");

<div id="yourDiv" class="box">
<img src="dp.png"/>
</div>
 function doMove(){
  var yourDiv = document.getElementById("yourDiv");
 }
相关文章：