2014-01-20 3 views
1

현재 사이트를 개발 중입니다. 현재의 레이아웃은 꽤 기본입니다.메뉴 탐색 원활화

상단에는 수평 메뉴 탐색 기능이 있으며 나머지 HTML 및 정보 등을 포함하는 메뉴 아래에 기본 중심 div가 있습니다.

사용자가 가로 메뉴에서 항목을 클릭하면 페이지가 다시로드되어 새 페이지가 새 HTML로 표시됩니다. 그러나 각 페이지에서 메뉴 HTML을 복사해야합니다. 이것은 중복되고 불필요한 것처럼 보입니다. 그래서 그것에 대해 생각하고 있었고 이런 식으로 생각했습니다 ...

JavaScript를 통해 주 콘텐츠 div에 html 페이지가 표시됩니다. 이렇게 ...

$.get("newpage.html", function(data) { 
    $("#content-div").html(data); 
}); 

모든 원본, 원본 및 원본 페이지에 css 및 html이로드되었습니다. 내가 할 수있는 두 즉각적인 혜택 ...

  1. 페이지 그것이 메뉴
에 올 때 중복 HTML이없는 새 페이지
  • 표시에 관해서 원활한, 원활한 전환을 가지고

    이것이 최적일까요? $.get(); 호출을 사용하여 새 HTML 페이지를 페이지 탐색의 주요 방법으로로드하는 것이 좋습니다. 더 나은 대안이 있습니까?

    나는 Jquery Tabs를 고려해 봤지만 이것은 모든 HTML을 미리로드해야한다는 것을 나는 주저했다.

  • 답변

    0

    답변은 그에 따라 다릅니다.

    유사한 레이아웃과 간단한 요소가있는 페이지가 여러 개있는 경우 예 : $.get(); 메서드가 작동하지만 더 빠르고 부드럽게 처리 될 수 있습니다.

    이 접합점을 발견하면 기존 HTML 요소를 그대로두고 새로운 내용을로드하기 만합니다.

    다시 전체 코드가 없으므로 나에게 공유하는 것이 무엇을 의미하는지 보여줄 수는 있습니다.하지만 공유 할 수있는 것은 여러분에게 달려 있습니다.

    페이지의 일부에 더 복잡한 요소가있는 경우 다시로드하여 탐색해야합니다.

    해당 공간에 일관성이 중요합니다.

    코드와 중복되지 않도록 사이트를 템플릿처럼 만들어야합니다.

    예를 들어 세 페이지 (머리글, 바닥 글 및 페이지 자체)가있을 수 있으며 코드를 한 번만 작성하는 동안 PHP를 사용하여 머리글과 바닥 글을로드 할 수 있습니다.

    HEADER.html 현재

    <html> 
    <head> 
    Fill with meta info, title, etc. 
    </head> 
    
    <body> 
    <div class="nav"> 
    Put the nav here. 
    </div> 
    

    index.php를

    <?php include_once "header.html"; ?> 
    <div class="main"> 
    Just fill it with all the page's content. 
    </div> 
    <?php include_once "footer.html"; ?> 
    

    바닥 글.HTML

    <div class="footer"> 
    Footer info here. 
    </div> 
    </body> 
    </html> 
    

    이는 <div> 's이 (가)에있는 각 페이지만큼, 모든 곳에서 비 중복 HTML을 한 번 편집을 제외하고,이며, 또한 CSS에 대한 사이트를 통해 보존하기 위해 편집 할 수 있습니다 무엇 동일한 클래스

    다시 말했듯이, 모든 것이 달려 있습니다.

    콘텐츠가 단순하고 스파게티 코드가 마음에 들지 않으면 각 탐색 용도에서 직접 div 정보를 바꾸는 것이 더 낫습니다.

    그러나이 방법은 적어도 내가 경험 한 것보다 광범위하고 다재다능하므로 PHP를로드 할 때 템플릿이 필요한 메서드를 사용하는 것이 좋습니다.