开发者

Javascript: Refere to Div Tags

开发者 https://www.devze.com 2023-03-17 18:17 出处:网络
I have a CSS style sheet that has the following: div.box img { width:100px; height:100px; border:1px solid;

I have a CSS style sheet that has the following:

div.box img {

  width:100px;
  height:100px;
  border:1px solid;
  display:inline;
}

This div tag basically re-sizes my image. My HTML file has the following:

 <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 sr开发者_Go百科c="dp.png"/>
</div>

I want to be able to move this box to the left once doMove() is called. How do i refer to my DIV tag in my stylesheet in javascript?


Assuming that you want only the div with the class-name of box:

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 demo.


If you're just trying to move that one div, the easiest thing would be to assign an id to that div:

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

And then to reference that div in your javascript, you would do:

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


<div id="yourDiv" class="box">
<img src="dp.png"/>
</div>

 function doMove(){
  var yourDiv = document.getElementById("yourDiv");
 }
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号