코드는 Codepen에서 작동하지만 데스크탑 파일에서는 작동하지 않습니다.

나는 index.html 파일과 script.js 파일을 사용하여 간단한 몇 줄의 코드 만 실행하려고합니다. HTML 파일에서 코드는 Codepen에서 작동하지만 데스크탑 파일에서는 작동하지 않습니다.

, 나는 문서 타입의 HTML을 가지고 :

var elems = $("div"); 
if (elems.length) { 
    var keep = Math.floor(Math.random() * elems.length); 
    for (var i = 0; i < elems.length; ++i) { 
    if (i !== keep) { 
     $(elems[i]).hide(); 
    } 
    } 
}

내가 CodePen이 실행, 또는에서 코드 편집기에 때 :

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="javascript/script.js"></script> 
</head> 
<body> 

    <div id="content1">This is content 1 </div> 
    <div id="content2">This is content 2 </div> 
    <div id="content3">This is content 3 </div> 

</body> 
</html>

그리고 내 자바 스크립트 섹션에 대해 내가 가지고

이 웹 사이트, 잘 작동합니다. 내 바탕 화면 (index.html을, script.js에있는 파일을 사용할 때하지만 자바 스크립트 폴더에있는 폴더 구조가 올바른지 (script.js이다 내가 믿는 할 작동하지 않습니다.)

당신에게 모든

감사

출처

2017-04-13 Tom Lud

그것은 분명 코드에 문제가되지 않습니다. 크롬 개발 도구 (ctrl + shift + i, 소스 탭)에서 파일을 확인하고 어떻게 생겼는지 확인하십시오. – TricksfortheWeb

문서가 준비가되어 있는지를 실행하기 위해이 기능의 코드를 포장

$(document).ready(function(){ 
// your code goes here 
});

출처

2017-04-13 22:31:46 Felix

이것이 효과가 있었고, 대단히 감사합니다! –

이 코드가 해결책 인 경우 수락 된 답변으로 설정할 수 있습니까? – Felix

그냥 body 태그의 폐쇄하기 전에 스크립트 태그를 이동

<script src="javascript/script.js"></script> 
</body>

이 방법은 DOM 것이다 스크립트가 실행될 때 사용할 수 있습니다.

당신이 다음 DOMContentLoaded 이벤트 처리기에 코드를 포장의 head 부분에 스크립트를 유지하는 것을 선호하는 경우

다음 DOM이 준비가되면

document.addEventListener("DOMContentLoaded", function() { 
    var elems = $("div"); 
    if (elems.length) { 
     var keep = Math.floor(Math.random() * elems.length); 
     for (var i = 0; i < elems.length; ++i) { 
     if (i !== keep) { 
      $(elems[i]).hide(); 
     } 
     } 
    } 
});

는 ... 그래서 당신의 코드를 실행해야합니다.

당신은 jquery와 함께 귀하의 질문에 태그를하지 못했지만, 당신이 그것을 사용하는 것, 당신이 위와 같이 본질적으로 같은 일이 짧은 코드를 사용할 수 있습니다 : 다음 코드는 codepen에 작동하는 경우

$(function() { 
    var $elems = $("div").hide(), 
    $elems.eq(Math.floor(Math.random() * $elems.length)).show(); 
});

출처

2017-04-13 22:32:16 trincot

이 덕분에 저를 구해 주셔서 감사합니다! –

[대답 중 하나를 수락 한 것으로 표시] (http://stackoverflow.com/help/someone-answers)를 잊지 마세요. – trincot

코드는 Codepen에서 작동하지만 데스크탑 파일에서는 작동하지 않습니다.

답변

관련 문제