2013-08-12 3 views
0
<html> 
    <head> 
    </head> 
    <body> 
<script> 


function toD(angle) { 
    return angle * (180/Math.PI); 
} 
var a = document.getElementById('test').innerHTML = toD(15); 
</script> 

<p id='test'> </p> 

    </body> 
    </html> 

Извините, я не уверен, что у меня что-то не хватает, но почему этот код не работает? спасибо заранее, извините, если это глупый вопрос!Почему этот простой код не запускается?

+0

Скопируйте код сценария в конце страницы, непосредственно перед tag –

ответ

8

Во время работы var a = document.getElementById('test').innerHTML = toD(15); в вашем скрипте <p id='test'> </p> не существует.

место сценарий ПОСЛЕ <p id='test'> </p> или обернуть весь сценарий в своей функции и присвоить его onload так, чтобы он бежал только после того, как <p id='test'> </p> и остальная часть DOM доступна.

Либо

<html> 
    <head> 
    </head> 
    <body> 

<p id='test'> </p> 

<script> 
function toD(angle) { 
    return angle * (180/Math.PI); 
} 
var a = document.getElementById('test').innerHTML = toD(15); 
</script> 
    </body> 
    </html> 

ИЛИ

<html> 
    <head> 
    </head> 
    <body> 
<script> 

window.onload = function() { 
    function toD(angle) { 
    return angle * (180/Math.PI); 
    } 
    var a = document.getElementById('test').innerHTML = toD(15); 
} 
</script> 

<p id='test'> </p> 

    </body> 
    </html> 

Примечание: это очень грязный способ использования window.onload, который следует использовать, только если это будет единственный скрипт на странице, которая требует onload. Для получения дополнительной информации об использовании onload должным образом, когда будет несколько сценариев, используя его, пожалуйста, прочитайте How to Use window.onload the Right Way

+0

Спасибо, так что я должен всегда поставить скрипт внизу? – Samir

+0

это зависит от требования, иногда вам также нужно написать свой скрипт в верхней части страницы. –

+1

@Samir. Это слишком много обобщения, так что нет.Посмотрите на контекст того, чего вы пытаетесь достичь, и принимайте решение на основе этих требований и требований сценария (ов). –

2

Посмотрите на JavaScript консоли [f12] и вы увидите сообщение об ошибке:

Uncaught TypeError: Cannot set property 'innerHTML' of null

ошибка возникает из-за вы ссылаетесь на элемент до его отображения на странице.

Поместите тег script после элемента, чтобы он мог найти элемент.

<html> 
    <head> 
    </head> 
    <body> 

    <p id='test'> </p> 

    <script> 

     function toD(angle) { 
      return angle * (180/Math.PI); 
     } 
     var a = document.getElementById('test').innerHTML = toD(15); 
    </script> 


    </body> 
</html> 
4

Вам нужно ждать, пока загрузки документа, как вы пытаетесь получить доступ к элементу (#test) до того, как HTML был полностью разобран браузером - вы можете использовать window.onload, чтобы ваш JS запускается после документ загружен - например,

window.onload = 

// JS 
+0

И вы собираетесь ответить на вопрос, когда OP пытается использовать 2 'window.onload ='? :) – epascarello

1

Потому что при запуске document.getElementById('test') DOM-объект <p id='test'> </p> еще не было вынесено.

0

Поместите скрипт в нижней части страницы, чтобы избежать проблем, подобных описанным выше, также используйте windows.onload http://www.w3schools.com/jsref/event_onload.asp - чтобы обеспечить визуализацию элемента перед тем, как наложить на него.

+3

* Всегда * не очень хороший совет. –

0

Проблема в оказании Измените код, как показано ниже:

<html> 
    <body> 
     <p id='test'> </p> 

    <script language="javascript"> 

     function toD(angle) { 
     return angle * (180/Math.PI); 
     } 
     var a = document.getElementById('test').innerHTML = toD(15); 
    </script> 


    </body> 
    </html> 

-> Пожалуйста, прочтите о том, как веб-страница разбора. вы очистите свое представление о том, где писать сценарий на своей странице.

-> объект должен быть визуализирован перед выполнением операции над ним. в вашем коде div не отображается, и вы пытаетесь выполнить на нем операцию (т.е. document.getElementById ('test'). innerHTML = toD (15);)

+1

Помогли, если бы вы объяснили, зачем вам это нужно. – epascarello

Смежные вопросы