2012-12-24 2 views
2

'im'클래스 내에서 'im'및 'desc'클래스의 속성을 변경하려고합니다. 현재 요소를 javascript 함수 mOver() 및 mDown()에 전달하고 있습니다. 이미지 아래에 텍스트가가 있어야한다로 변경되지클래스의 요소 속성 변경

<html> 
<head> 
<style> 
.img 
    { 
    margin:2px; 
    border:1px solid #0000ff; 
    height:90; 
    width:110; 
    float:left; 
    text-align:center; 
    } 
.im 
    { 
    width:110px; 
    height:90px; 
    display:inline; 
    margin:3px; 
    border:1px solid #ffffff; 
    } 
.desc 
    { 
    text-align:center; 
    font-weight:normal; 
    width:120px; 
    margin:2px; 
    } 
</style> 
<script> 
function mOver(a) 
    { 
    a.style.border="10px solid #0000ff"; 
    a.getElementByClassName("desc").innerHTML="Click on the image"; 
    } 
function mDown(a) 
    { 
    a.style.border="1px solid #ffffff"; 
    a.getElementByClassName("desc").innerHTML="You have clicked already"; 
    } 
</script> 
</head> 
<body> 
<div class="img" onmouseover="mOver(this)" onmouseout="mDown(this)"> 
    <a target="_blank" href="abc.png"> 
    <img class="im" src="abc.png"></a> 
    <div class="desc">ABC</div> 
</div> 
<div class="img" onmouseover="mOver(this)" onmouseout="mDown(this)"> 
    <a target="_ blank" href="def.png"> 
    <img class="im" src="def.png"></a> 
    <div class="desc">DEF</div> 
</div> 
</body> 
</html> 

: change.Here 내 코드가해야 아래에 나는 이미지의 경계뿐만 아니라 텍스트 마우스를 움직일 .When. 은 내가가 "S"와 사전

그것은해야
+0

는'getElementsByClassName' (복수) 있어야하지 읽어? – m90

답변

2

getElementsByClassName 잘못 here.Anyways 덕분에 무엇을 줄

a.getElementByClassName("desc").innerHTML="You have clicked already"; 

내가 그렇게 알려 주시기 바랍니다 자바 스크립트 비교적 새로운 오전에 뭔가 문제라고 생각합니다 . 또한 변경하려는 innerHTML 요소의 색인을 표시해야합니다. 첫 번째 요소를 변경하려면 다음을 수행하십시오.

a.getElementsByClassName("desc")[0].innerHTML = "You have clicked already"; 

배열은 0 인덱싱이므로 메서드에서 반환 한 배열의 첫 번째 요소가 변경됩니다.

하지만 당신은 그 클래스의 이름을 가진 모든 요소를 ​​변경하려면 다음을 수행해야합니다 루프를하고자한다면 :

var elements = a.getElementsByClassName("desc"); 

for (var i = elements.length; i--;) { 
    elements[i].innerHTML = "You have clicked already"; 
} 
+0

도움을 주신 덕분에 – Tyranicangel

1

사용하려고하는 방법은 getElementsByClassName은 (는 여러 요소를 기대하고 반대 찾을 수라고합니다 를 getElementById)로 변경하고 노드 목록을 반환합니다. 당신의 라인을 따라서 읽어야 문서에 대해서는

a.getElementsByClassName("desc")[0].innerHTML="You have clicked already"; 

MDN on NodeLists

+0

감사합니다. – Tyranicangel

관련 문제