jQuery działa w konsoli, ale nie w oryginalnym kodzie

Question

Próbowałem tego kodu, aby dodać href do tagu wewnątrz td. działa dobrze, gdy robię to w konsoli. Ale kiedy próbuję tego samego w moim kodzie, to nie działa. Czy ktoś może mi powiedzieć, dlaczego?

<script> 
    $("table tbody tr td a").attr('href','http://www.google.com'); 
</script> 
<table> 
    <tr> 
     <td><a >Hai</a></td> 
    </tr> 
</table> 

Answer 1

umieścić go w gotowej części:

<script type="text/javascript"> 
$(document).ready(function() { 
$("table tbody tr td a").attr('href','http://www.google.com'); 
}); 
</script> 

Answer 2

Element nie istnieje, gdy jQuery jest wykonywany. Musisz umieścić swoich opiekunów w gotowej funkcji.

<script type="text/javascript"> 
$(function() { 
    $("table tbody tr td a").attr('href','http://www.google.com'); 
}); 
</script> 

$(function() {}); jest skrótem $(document).ready(function() {});

Answer 3

Korzystanie document.ready()

$(document).ready(function() { 
    $("table tbody tr td a").attr('href','http://www.google.com'); 
} 

Musisz upewnić się, że dokument jest już załadowany, przed próbą manipulowania DOM.

Więcej informacji na: http://api.jquery.com/ready/

Answer 4

Twój kod wykonywany przed DOM jest gotowy i element rzeczywiście istnieje, spróbuj to w ten sposób:

<script> 
    $(document).ready(function(){ 
     $("table tbody tr td a").attr('href','http://www.google.com'); 
    }); 
</script> 

Powodem działa na konsoli dlatego elementu <a> istnieje już podczas wykonywania kodu ...

JSBin Demo

Answer 5

JS uruchamia się przed utworzeniem html.

<table> 
    <tr> 
     <td><a >Hai</a></td> 
    </tr> 
</table> 
<script> 
    $(function() { 
     $("table tbody tr td a").attr('href','http://www.google.com'); 
    }); 
</script>