2010-06-21 9 views
1

수동으로 숨기는 시스템 생성 링크가 있습니다. 이제 주변 텍스트를 복사 할 때 복사되는 링크의 제목 속성을 제거하고 싶습니다.여러 자식 요소의 특성을 제거하는 방법은 무엇입니까?

<html> 
<head> 
<script type="text/javascript"> 

    var getElementsByClassName = function (className, tag, elm){ 
    if (document.getElementsByClassName) { 
     getElementsByClassName = function (className, tag, elm) { 
      elm = elm || document; 
      var elements = elm.getElementsByClassName(className), 
       nodeName = (tag)? new RegExp("\\b" + tag + "\\b", "i") : null, 
       returnElements = [], 
       current; 
      for(var i=0, il=elements.length; i<il; i+=1){ 
       current = elements[i]; 
       if(!nodeName || nodeName.test(current.nodeName)) { 
        returnElements.push(current); 
       } 
      } 
      return returnElements; 
     }; 
    } 
    else if (document.evaluate) { 
     getElementsByClassName = function (className, tag, elm) { 
      tag = tag || "*"; 
      elm = elm || document; 
      var classes = className.split(" "), 
       classesToCheck = "", 
       xhtmlNamespace = "http://www.w3.org/1999/xhtml", 
       namespaceResolver = (document.documentElement.namespaceURI === xhtmlNamespace)? xhtmlNamespace : null, 
       returnElements = [], 
       elements, 
       node; 
      for(var j=0, jl=classes.length; j<jl; j+=1){ 
       classesToCheck += "[contains(concat(' ', @class, ' '), ' " + classes[j] + " ')]"; 
      } 
      try { 
       elements = document.evaluate(".//" + tag + classesToCheck, elm, namespaceResolver, 0, null); 
      } 
      catch (e) { 
       elements = document.evaluate(".//" + tag + classesToCheck, elm, null, 0, null); 
      } 
      while ((node = elements.iterateNext())) { 
       returnElements.push(node); 
      } 
      return returnElements; 
     }; 
    } 
    else { 
     getElementsByClassName = function (className, tag, elm) { 
      tag = tag || "*"; 
      elm = elm || document; 
      var classes = className.split(" "), 
       classesToCheck = [], 
       elements = (tag === "*" && elm.all)? elm.all : elm.getElementsByTagName(tag), 
       current, 
       returnElements = [], 
       match; 
      for(var k=0, kl=classes.length; k<kl; k+=1){ 
       classesToCheck.push(new RegExp("(^|\\s)" + classes[k] + "(\\s|$)")); 
      } 
      for(var l=0, ll=elements.length; l<ll; l+=1){ 
       current = elements[l]; 
       match = false; 
       for(var m=0, ml=classesToCheck.length; m<ml; m+=1){ 
        match = classesToCheck[m].test(current.className); 
        if (!match) { 
         break; 
        } 
       } 
       if (match) { 
        returnElements.push(current); 
       } 
      } 
      return returnElements; 
     }; 
    } 
    return getElementsByClassName(className, tag, elm); 
}; 

function notitle() { 
    var mylist=document.getElementsByClassName("notitle"); 
    for (j=0; j<mylist.length; j++) { 
    var listitems= mylist[j].getElementsByTagName("a"); 
    for (i=0; i<listitems.length; i++) { 
     listitems[i].removeAttribute("title"); 
    } 
    } 
} 
</script> 
</head> 

<body onLoad="notitle()"> 

<p>Before hidden link 1: <span class="notitle" style="display: none;"> 
<a href="#Foo" title="Foo">This link should have no title attribute</a> 
</span>After hidden link 1.</p> 

<p>Before hidden link 2: <span class="notitle" style="display: none;"> 
<a href="#Foo" title="Foo">This link should have no title attribute</a> 
</span>After hidden link 2.</p> 

<p>Before hidden link 3: <span class="notitle" style="display: none;"> 
<a href="#Foo" title="Foo">This link should have no title attribute</a> 
</span>After hidden link 3.</p> 
</body> 
</html> 

함수의 모양이 올바르게 보이게해야합니까? 나는 한 번이

function notitle() { 
    var mylist=document.getElementById("notitle"); 
    var listitems= mylist.getElementsByTagName("a"); 
    for (i=0; i<listitems.length; i++) { 
    listitems[i].removeAttribute("title"); 
    } 
} 

를 사용하여 작업 가지고 있지만 그 첫 번째 링크에 적용했다.

답변

1

. id 속성은 문서 전체에서 고유해야합니다. 그렇지 않으면이 id를 가진 첫 번째 요소 만 찾습니다.

대신 id="notitle"class="notitle"을 시도하고 당신은 JS는 다음과 같아야합니다

function notitle() { 
    var mylist=document.getElementsByClassName("notitle"); 
    for (j=0; j<mylist.length; j++) { 
    var listitems= mylist[j].getElementsByTagName("a"); 
    for (i=0; i<listitems.length; i++) { 
     listitems[i].removeAttribute("title"); 
    } 
    } 
} 

난 그냥, 내가 propblem 이런 종류의 자바 스크립트 프레임 워크를 사용하는 제안이 크로스 브라우저를 작동하지 않을 배운대로 왜냐하면 그러한 프레임 워크는 크로스 브라우저 호환이기 때문입니다.

당신은 모든 브라우저에서 작동하도록 당신의 웹 사이트에 다음 스크립트를 추가 할 수 있습니다 http://code.google.com/p/getelementsbyclassname/downloads/detail?name=getElementsByClassName-1.0.1.js

그건 훨씬 더 쉽게 당신이 어떤 자바 스크립트 프레임 워크를 사용한다면. 다음은 jQuery 예제입니다.

function notitle() { 
    $(".notitle a").removeAttr("title"); 
} 
+0

모든 브라우저/버전에서 document.getElementsByClassName을 지원하지는 않습니다. –

+0

@Peter Kruithof :이 팁을 가져 주셔서 감사합니다. 나는 이것을 알지 못했다. – jigfox

+0

고마워, 클래스 버전을 사용해 보았지만 최신 FF 및 Chrome에서는 작동하지 않습니다. – Martin

1

귀하의 접근 방식은 정확하지만 당신은 동일한 ID를 여러 번 사용하고 있습니다. ID가 다른지 확인하거나 일반 클래스 이름을 사용하여 요소를 이와 같이 검색하십시오. 여러 요소에 동일한 ID 속성을 제공 should't 때문이다

관련 문제