2012-06-25 3 views
3

많은 DOM 요소의 style:display 속성을 변경하려면 루프를 만들거나 (.each 사용) 시도하고 있습니다. 나의 초기 생각은 내가 ptext1라는 이름의 모든 요소를 ​​선택 getElementsByName을 사용하는 것이었다 : 이름으로 모든 요소의 객체/배열을 만들려면여러 요소의 스타일 변경

var TextElements = document.getElementsByName("ptext1"); 

를 사용

<p id="ptext0"name="ptext">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
<p id="ptext1"name="ptext1">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
<p id="ptext2"name="ptext1">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
<p id="ptext3"name="ptext1">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
<p id="ptext4"name="ptext1">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
<p id="ptext5"name="ptext1">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
<p id="ptext6"name="ptext1">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 

ptext1

하지만 그 방법이 올바르게 작동하지 않아서 .each으로 옮겼습니다.

$.each(TextElements, function (index) { 
    this.style.display="none"; 
}); 

$('td[name=ptext1]').each(function (index) { 
    this.style.display="block"; 
}); 

은 (는 경고를 사용하여 실행 여부를 제가 테스트했습니다)가 제대로 작동하지 않았다.

이제 누군가 내 실수가 어디 있는지 확인할 수 있거나 더 나은 방법을 제안 할 수 있다면 나는 모두 귀입니다. 이것은 단순한 조작이어야하지만 어떤 이유로 든 내가 시도 할 때마다 실패합니다.

편집 : $('p[name=ptext1]').hide()$('p[name=ptext1]').show()

<p id="ptext0"name="ptext">Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
     </p> 

각 라인은 다른 ID 태그가, 또한 내가 숨기고 싶은 것들 위의 라인을 숨 깁니다) (.hide 제외하고 노력하고 있습니다,하지만 난 노력하고 있어요 name 태그를 사용하여 내가 숨기고 싶은 것들을 추적 할 수 있지만, 남아 있어야하는 줄 (name = "ptext")도 숨 깁니다. 당신이 표시된 선을 유지 .not()와 그 라인 제외하려면

$('p[name="ptext1"]').css('display', 'none');// you can use block... 

:

+0

복사/붙여 넣기 오류 일 수 있지만'name' 속성 전에는 공백이 없기 때문에 속성에 의한 선택 작업에 ​​반드시 영향을 미칩니다 ('name'은'p'에서 엄격히 유효하지 않습니다. 요소). – Jamiec

답변

8

왜 당신은 단순히 사용하지 않는

$('p[name="ptext1"]').not('#ptext3').css('display', 'none');// you can use block... 

http://jsfiddle.net/4JCvt/

을 그리고 만약 단지를 바닐라 자바 ​​스크립트를 사용하려면 다음을 할 수 있습니다.

,210

http://jsfiddle.net/4JCvt/2/

+0

이름'$ ('td [name = "ptext1"]') '주위에 따옴표가 있어야하고 OP의 요소가't'가 아닌'p'입니다. – Jamiec

+0

@Jamiec는 꼭 필요하지 않습니다. 어쨌든 작동해야합니다 :) –

+1

아마도 대부분은 작동하지만, 문서 (http://api.jquery.com/attribute-equals-selector/)를 읽으십시오. - "속성 선택자가 속성 값을 따옴표로 묶습니다." – Jamiec

0

jQuery("*[name$='ptext1']").css('display', 'block'); 

또는

jQuery("*[name$='ptext1']").css('display', 'none'); 
0

이 쉽고, IE8 작동을 작동합니다.그냥 "myDiv"라는 <div>에 모든 <p> 요소를 넣어

function myFunction() { 
    var x = document.getElementById("myDIV"); 
    var y = x.getElementsByTagName("P"); 
    var i; 
    for (i = 0; i < y.length; i++) { 
     y[i].style.display="none"; } 
} 
  • 당신이 당신의 <div>, 사용 ("*")을 모두 변경 요소하려는 경우 :

    var y = x.getElementsByTagName("*"); 
    
  • 당신이 만약 <div>의 두 번째 <P> 요소를 변경하려면 다음을 사용하십시오.

    x.getElementsByTagName("p")[1].style.backgroundColor = "red"; 
    

이는 어레이와 유사합니다.