HTML 만들기: PHP 서버 측과 jQuery 클라이언트 측

HTML 만들기: PHP 서버 측과 jQuery 클라이언트 측

닫았습니다. 이 질문은의견 기반의현재 답변을 받고 있지 않습니다.

---

이 질문을 개선하시겠습니까?이 게시물을 편집하여 사실과 인용문으로 답변할 수 있도록 질문을 업데이트하십시오.

2년 전에 문을 닫았어요

이 질문을 개선하다

이것은 디자인 질문입니다.HTML 테이블에 들어가야 하는 데이터가 있는데 나중에 사용자가 조작하게 됩니다.기본적으로 사용자는 테이블 행의 항목을 선택할 수 있습니다.

두 가지 옵션이 있습니다. 두 가지 경우 모두 AJAX를 사용하여 데이터를 가져옵니다.

1. 서버 측에서 PHP를 사용하여 HTML 코드를 생성하여 클라이언트에 HTML로 전송합니다. 그러면 사용자는 Javascript(기본적으로 jQuery)를 사용하여 테이블을 조작합니다.

2. JSON을 사용하여 원시 데이터를 클라이언트에 보낸 다음 jQuery를 사용하여 HTML을 생성하고 나중에 사용자가 조작합니다.

코딩의 설계/간단함/뷰티 관점에서 권장되는 접근법은 무엇입니까?통찰해 주셔서 감사합니다.

PHP에서 HTML을 생성하는 이유:

• JavaScript는 내용이 아닌 동작을 정의해야 합니다.
• JavaScript에서 작성하려면 더 많은 마크업이 필요합니다(다행 문자열은 PHP에서처럼 쉽지 않습니다).
• HTML이 여러 곳(PHP 및 JS)에서 생성되면 유지보수가 어렵습니다.
• HTML을 작성하기 위해 jQuery의 DOM 조작 기능을 사용할 수 있지만, 장기적으로는 자신의 다리를 촬영하고 있습니다.
• HTML을 작성하는 것이 브라우저(계산적 의미)보다 서버에서 작성하는 것이 더 빠릅니다.
• PHP를 사용하면 루핑이 쉬워집니다.테이블 마크업을 쉽게 생성할 수 있습니다.
• 페이지 로드 시 마크업을 출력하면 사용자가 JavaScript를 비활성화하면 일종의 전투성을 유지할 수 있습니다.

jQuery에서 HTML을 생성하는 이유:

• 대역폭을 절약할 수 있습니다.
• 바인딩 이벤트가 더 간단할 수 있습니다.

그래서 저는 첫 번째 옵션을 선호합니다.HTML을 PHP로 생성하는 것입니다.

---

두 방법을 시각적으로 비교하여 간단한 표를 만듭니다.  

옵션 1, PHP 사용:

// PHP

$html = '<table>';    
foreach($data as $row) {
    $html .= '<tr>';
    $html .= '<td><a href="#" class="button">Click!</a></td>';
    $html .= '<td>'.$row['id'].'</td>';
    $html .= '<td>'.$row['name'].'</td>';
    $html .= '</tr>';
}
$html .= '</table>'; 
echo $html;
?>

// jQuery

$('#container').load('handler.php', function() {
    $('#container a.button').click(function() {
        // Do something
    });
});

 

옵션 2, jQuery 사용:

// PHP

echo json_encode($data);

// jQuery

$.ajax({
    url: 'handler.php',
    dataType: 'json',
    success: function(data) {
        var table = $('<table />');

        var len = data.length;
        for(var i = 0; i < len; i++) {
            var row = $('<tr />');
            var a = $('<a />').attr('href', '#').addClass('button');

            row.append($('<td />').append(a));
            row.append($('<td />').html(data[i].id);
            row.append($('<td />').html(data[i].name);

            table.append(row);
        }

        table.find('.button').click(function() {
            // Do something
        });

        $('#container').html(table);
    }
});

디자인, 코딩의 용이성, 아름다움의 관점에서 볼 때 PHP 접근 방식을 택하는 것이 좋습니다.

생성된 HTML이 페이지 HTML과 동일한 경우 기존 템플리트 코드를 활용하여 코드 중복이 적은 동일한 HTML을 생성할 수 있습니다.

그렇지 않으면 JSON은 일반적으로 더 컴팩트한 경향이 있고 노드를 생성하여 진행 시 이벤트핸들러와 같은 비HTML 속성을 할당할 수 있기 때문에 일반적입니다.

단, HTML 스트링을 생성하여 새로운 노드를 작성하는 경우 HTML 인코딩을 사용하여 다음 노드를 생성해야 합니다.<,&또는 따옴표가 올바르게 이스케이프됩니다.JavaScript에는 다음과 같은 내장 함수가 없습니다.htmlspecialcharsPHP에서는, 쓰는 것은 매우 간단하지만, 아무도 신경 쓰지 않는 것 같습니다.그 결과, 서버측의 XSS를 수정하기 시작한 시점에서, 클라이언트측의 크로스 사이트 스크립팅의 시큐러티 홀이 가득 찬 jQuery 앱이 완성되었습니다.

마찬가지로 설득력 있는 주장이 두 가지 모두에 대해 제기될 수 있지만, 2를 선택하면 더 적은 양의 데이터를 전송할 수 있습니다.

저는 이런 것들을 클라이언트 측에 정리하는 아이디어가 정말 마음에 들어요.JavaScriptMVC는 클라이언트 사이드 뷰 템플릿이 있기 때문에 (모든 사람이 그 접근방식을 좋아하는 것은 아니지만) 좋은 프레임워크(2.0 버전은 jQuery 기반)라고 생각했습니다.

jQuery만으로는 클라이언트 측 뷰를 작성하는 것이 매우 복잡하다는 것을 알 수 있습니다(그것은 의도한 바가 아니기 때문에). 따라서 애플리케이션을 동일하게 동적으로 유지할 수 있다면 PHP에서 모든 것을 서버 측으로 통합하는 것이 더 나을 수 있습니다.

두 옵션 모두 플러스 포인트와 마이너스 포인트가 있지만 Andras는 콘텐츠의 색인화/검색 가능 여부를 기술하는 데 적합합니다.저는 개인적으로 옵션 1을 선택하고 싶습니다.아키텍처가 생산하기 쉽다고 생각합니다.

언급URL : https://stackoverflow.com/questions/2307535/creating-html-php-server-side-vs-jquery-client-side