2012-07-29 4 views
0

지금 당장 프로젝트를 끝내고 각 페이지에 많은 자바 스크립트 코드가 있다는 것을 확인합니다. 그것은 ".js"파일로 포함되지 않고 오히려 페이지 자체에 코딩되어 있습니다. 나는 나쁜 아이디어라고 생각 했으므로 지금은 그것들을 모두 하나의 .js 파일에 넣고 각 페이지에 포함하려고합니다.자바 스크립트 파일 포함

내가 직면 한 유일한 문제는 다음과 같습니다. 일부 기능은 특정 페이지에서만 호출되며 jquery 플러그인 포함 여부에 달려 있습니다. 모든 페이지가 플러그인을 필요로하지는 않습니다.

예 : 홈 페이지에서 국가 드롭 박스와 도시 드롭 박스를 연결해야하므로 jquained 용 jchained.js 플러그인이 필요합니다. 내가 사용하는 데 필요한 코드는 다음과 같습니다

: 나는의 .js 파일에이 기능을 추가하고, 내가 사슬에 보관함이 필요하지 않습니다 어디 페이지를 열 때

$(function(){ 
    $("#city").chained("#country"); 
}); 

내가 논리적으로 오류가

TypeError: $("#city").chained is not a function

이렇게 올바르게 이해하면 .js 파일을 다른 플러그인에 대한 모든 다른 기능과 함께 사용하려면 모든 플러그인을 모든 페이지에 포함해야합니까?

귀하의 아이디어에 감사드립니다 & 도움.

+0

을 당신이 분할하지 않는 이유 : 또 다른 옵션은, 조금 더 지루한이기는하지만, 당신이 (플러그인의 .js 포함 된 경우) 함수가 존재에 대한 확인을 한 후가하는 경우를 호출 할 수있다 여러 파일에 함수? JQuery 의존적 인 코드를 하나의 파일에두고 나머지는 JQuery에 의존하지 않도록한다. 아마 더 세분화가 좋을 것입니다. 얼마나 많은 코드와 작성 방법에 따라 다릅니다. – toniedzwiedz

+0

@Tom : ".js"파일을 많이 만들지 않겠습니까? 나는 모든 함수에 대해 분리 된 파일을 필요로 할 것이고 나는 다른 플러그인을위한 많은 기능을 가지고있다. – moonwalker

+0

나는 코드를 보지 못했다. 우려의 분리에 대해 기억한다면 그것은 문제가되지 않습니다. 그렇다면 JS는 엄청난 리팩토링이 필요할 것입니다. – toniedzwiedz

답변

1

개인적으로, 웹 개발의 일부인 .js 파일을 많이 포함하는 것에 대해 걱정하지 않아도된다고 생각합니다.

if(typeof yourFunctionName == 'function') { 
    yourFunctionName(); 
} 
+0

"많은 .js 파일을 포함하는 것에 대해 걱정하지 않아도됩니다."더 분리 된 JS 파일은 더 많은 요청을 의미합니다. 즉, 특히 모바일과 같은 대역폭이 제한적인 장치에서 페이지로드가 느려집니다. 모든 JS 파일을 프로덕션 환경 용으로 하나로 연결하여 하나의 요청 만 수행하도록합니다. 나는 그 파일도 축소했다. – redhotvengeance

+0

@ilollar : 정확히 내 요점. 그러나 하나의 파일 만 사용하려면 모든 내 페이지에 사용 된 모든 플러그인을 포함시켜야합니다. – moonwalker

+2

@moonwalker 그렇습니다. 그러나 모든 페이지에 대해 하나의 연결되고 축소 된 JS 파일 인 경우 첫 번째 페이지로드 후에 캐싱됩니다. 나머지 페이지는 걱정하지 않아도됩니다. 또는 각 페이지에 대한 기본 JS 파일을 만들고 다른 JS 파일과 공유 기능을 분리하고 [browserify] (https://github.com/substack/node-browserify)와 같은 것을 사용하여 필요한 것을 "요구"할 수 있습니다 각 메인 페이지 JS의 코드. – redhotvengeance

1

코드가 어떻게 구성되는지 또는 현재 코드가 얼마나 복잡한 지에 따라 완전히 다릅니다.

즉각적인 해결책이 될 것

  1. 은 (body 태그에있을 수 있습니다) 각 페이지에 ID를 부여합니다.
  2. 모든 코드를 하나의 외부 JavaScript 파일에 넣으십시오.
  3. 해당 body 요소에 id가 필요한 경우에만 해당 특정 페이지에 대한 코드를 실행하십시오. 뭔가 같은 : (. $ ('몸') ATTR ('ID') == "집")

    경우 { /* 추가 ​​홈 페이지 JS 여기에 */ }

당신 이것을 시도 할 수 있습니다. 만약 내가 잘못

저를 수정합니다.

+0

좋은 아이디어. 하지만 나는 숀이 준 답을 찾아야 할 것입니다. 당신의 도움을 주셔서 감사합니다! – moonwalker