2012-01-26 7 views
1

다음 코드는 테스트 코드입니다. 일반적으로 링크의 href는 'http://www.google.com/'을 가리키고 있지만 attr은 'http://maps.google.com'을 참조하도록 변경해야하지만 참조는 변경되지 않습니다. 아무도 왜 작동하지 않는지 말할 수 있습니까? 감사합니다href 링크 내용 변경

<html> 
<head> 
<script type="text/javascript"> 
$("a#changeme").attr('href', 
'http:\/\/maps.google.com/'); 
</script> 
</head> 
<body> 
<div class="content"> 
<p>Link to <a href="http://www.google.com/" 
id="changeme">Google</a> 
in the content...</p> 
</div> 
</body> 
</html> 
+0

선택기로 '# changeme'를 사용하지 않는 이유는 무엇입니까? ID 선택기가 가장 빠릅니다. 셀렉터는 거꾸로 실행되므로 #changeme를 먼저 찾은 다음 앵커 만 필터링합니다 ....하지만 고유 ID가있는 경우 왜 그렇게합니까? –

+0

왜'text/javascript'를 사용합니까? 현대의 모든 브라우저는'type' 속성없이 스크립트 태그를 자바 스크립트로 해석합니다. 이것은 아주 오래된 기술입니다. –

답변

2
  1. jQuery를로드하지 않습니다.
  2. 그렇다면 $(document).ready 처리기로 묶어야합니다.
  3. jQuery없이이 작업을 수행 할 수 있습니다.

코드 :

window.onload = function() { 
    document.getElementById("changeme").href = 'http://maps.google.com/'; 
}; 

onload 핸들러가 DOMContentLoaded 핸들러에 exactely 동일하지 않지만 더 나은 지원을하고, 여기에 바람직 할 수있다. 또는, <body>의 끝에 <srcipt> 블록을 이동할 수 있습니다, 그리고 어떤 onload 핸들러없이 방법을 사용하십시오

<body> 
<div class="content"> 
<p>Link to <a href="http://www.google.com/" id="changeme">Google</a> 
in the content...</p> 
</div> 
<script type="text/javascript"> 
    // This code is placed after the element, so the reference does exist now. 
    // In the head, the same code will throw an error, because the body doesn't 
    // even exist. 
    document.getElementById("changeme").href = 'http://maps.google.com/'; 
</script> 
</body> 
+0

확인. 그래서 지금 내 문제의 핵심. 변경해야 할 참조는 다음 스크립트의 XXX 비트입니다. –

+0

* * * 스크립트의 "XXX bit"? –

+0

Soory는 스크립트를 잊어 버렸지 만, 이후에 내가 제안한 것을 시도해 보았고 내 문제를 해결했다고 생각합니다. 그래도 철저하게 확인해야합니다. 다시 한 번 감사드립니다. –

0

다른 내용이로드되기 전에이 (있는 경우 실행 그래서 스크립트는 헤더에 jQuery는 심지어 활성화되어 있으므로 참조가 없습니다.) 함수에 넣은 다음 나중에 호출해야합니다 (예 : onload 또는 타이머를 통해). 브라우저의 보안 기능에 대해 생각해 볼 수 있습니다. 링크를 클릭하기 바로 전에 사이트가 링크를 조작하지 못하게 할 수 있습니다.

+0

고마워요. 지금 당장 이해합니다. 보안 기능은 무엇입니까? –

+0

나는 그 중 하나에 대해서는 잘 모르겠다. 상태 표시 줄에 'http://www.google.com/'이라는 링크가있을 수 있지만 두 번째 클릭하면 'http://www-google-com.fake-site.com/'으로 설정됩니다. 그러나 언급했듯이, 스크립트를 작성하는 방식 (함수 외부) 때문에 가능성이 더 높습니다. – Mario

0

다음은 문서 준비를 사용하여 올바른 jQuery 방법을 수행하는 코드입니다.

<html> 
<head> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$("#changeme").attr('href', 'http:\/\/maps.google.com/'); 
}); 
</script> 
</head> 
<body> 
<div class="content"> 
<p>Link to <a id="changeme" href="http://www.google.com/">Google</a> 
in the content<a href="test">test</a>...</p> 
</div> 
</body> 
</html>