Использование phpQuery

Используя на сервере код PHP вы можете изменить и управлять HTML. Для этого phpQuery отличное решение. Если вы еще не слышали о phpQuery, вы должны быть заинтересованы в этой статье, так как здесь краткое объяснение, как можно использовать phpQuery в своих проектах.

Что такое phpQuery

phpQuery — это на стороне сервера, цепной, CSS3 селектор, управляемый объектной модели документа (DOM) API на основе библиотеки jQuery JavaScript.

Это определение на странице проекта phpQuery . Если использовать jQuery, можно упростить решение многих задач, требующих манипуляции с DOM. phpQuery обладает точно такой же функциональностью, которую использует на сервере код PHP. Вы можете сказать: до свидания, неопрятным генерациям кода HTML, используя методы phpQuery.

Большинство функциональных возможностей, предоставляемых jQuery в phpQuery, в целом можно разделить на 4 задачи:

  • Создание элементов DOM
  • Выбор и работа с элементами
  • Перебор элементов DOM
  • Вывод в браузер

Вы можете выполнить задачи, используя возможности, предоставляемые phpQuery, который известен как «ported jQuery sections»:

  • Selectors — найти элементы на основе заданных условий.
  • Attributes — работа с атрибутами элементов DOM.
  • Traversing — путешествие через список выбранных элементов.
  • Manipulation — добавление и удаление содержимого выбранных элементов.
  • Ajax — создание сервера Ajax запросов.
  • Events — связать DOM событий на отдельных элементах.
  • Utilities — добавить функцию для работы с другими функциями.

Скачать библиотеки phpQuery на странице проекта code.google.com / р / phpquery . Скопируйте папку на ваш веб-сервере. Установка очень проста, нужно создать файл demo.php.

Использовать phpQuery

Как создать две колонки с неупорядоченным списком, с заголовками, и разных цветов, строка для четных и нечетных цифр:

Как использовать phpQuery

Сначала создадим документ HTML с phpQuery:



<?php
require("phpQuery/phpQuery.php");
$doc = phpQuery::newDocument("<div/>"); 



Приведенный выше код создает основной документ HTML с div тегами. Библиотека предоставляет различные способы создания документов, мы используем простой, но вы можете найти другие demo.php в документации.

Теперь нам нужно создать неупорядоченный список и добавить его в документ HTML



<?php
...
$doc["div"]->append("<ul><li>Product Name</li><li>Price</li></ul>");
$products = array(
    array("Product 1","$30"),
    array("Product 2","$50"),
    array("Product 3","$20"));

foreach($products as $key=>$product) {
    $doc["div ul"]->append("<li>$product[0]</li><li>$product[1]</li>");
}
print $doc; 



Неупорядоченный список готов. Но по умолчанию все элементы в одну колонку. Делаем элементы списка во второй колонке.



<?php
...
$doc["div ul"]->attr("style", "width:420px;");
$doc["div ul"]->find("li:even")->attr("style","width:200px; float:left; padding:5px; liststyle:none;");
$doc["div ul"]->find("li:odd")->attr("style","width:200px; float:left; padding:5px; liststyle:none;"); 



В коде использован атрибут стиля для определения стилей CSS необходимые для нашего примера, не рекомендуется использовать встроенные стили. Если есть необходимость в стилях CSS правильно использовать классы для добавления стилей.

Выделяем заголовок и четные строки, используя методы phpQuery.



<?php
...
$doc["div ul"]->find("li:nthchild(4n)")->attr("style","background:#EEE; width:200px; float:left; padding:5px; liststyle:none;");
$doc["div ul"]->find("li:nth-child(4n-1)")->attr("style","background:#EEE; width:200px; float:left; padding:5px; list-style:none;");
$doc["div ul"]->find("li:lt(1)")->attr("style","background:#CFCFCF; width:200px; float:left; padding:5px; liststyle:none;"); 



Вот и всё, пример готов, теперь вы должны иметь представление о том, как можно использовать phpQuery для упрощения HTML на стороне сервера. Все что мы сделали это почти то же самое будет сделано с jQuery, за исключением действия с объектом $doc .

Важность phpQuery

На вопрос: почему нужно использовать phpQuery, если есть jQuery на стороне клиента? Я отвечу с помощью практических сценариев phpQuery.

Рассмотрим следующую ситуацию: предположим, у нас есть таблица, которая содержит всю информацию о веб-разработчиках, которые пришли на собеседование.

Важность phpQuery

Вот список требований, которые мы должны быть в этом случае:

  • Абитуриенты, которые получили выше 60-ти балов для собеседования, должны быть выделены синим цветом.
  • Абитуриенты, имеющие более 3 лет опыта работы, должны быть с ссылками перед надписью «Старший инженер-программист» а другие претенденты должны иметь ссылку «Инженер-программист».
  • Компания имеет структуру зарплаты, основанную на опыте работы:
    • 1 год — $ 5,000
    • 2 года — $ 10,000
    • 3 года — $ 20,000
    • более 3 лет — $ 50,000

    Для абитуриентов, которые соответствуют этим критериям, колонки с зарплатой должны быть выделены зеленым цветом.

Результат:

Важность phpQuery

Разработчик может предоставить следующие решения для удовлетворения потребностей с использованием чистого кода PHP.



<?php
// retrieve applicants from database
//...

echo <<<ENDHTML
<div id="main">
 <div class="row_head">
  <div>Name</div>
  <div>Marks</div>
  <div>Experience</div>
  <div>Position</div>
  <div>Expected Salary</div>
 </div>
ENDHTML;
foreach ($applicants as $applicant) {
    echo '<div class="row">';
    echo "<div>" . $applicant["name"] . "</div>";
    echo '<div class="' . marksClass($applicant["marks"]) . '">' . $applicant["marks"] . "</div>";
    echo "<div>" . $applicant["experience"] . "</div>";
    echo "<div>" . positionLink($applicant["experience"]) . "</div>";
    echo '<div class="' . salaryClass($applicant["experience"], $applicant["salary"]) . '">' . $applicant["salary"] . "</div>";
    echo "</div>";
}
echo "</div>";

<?php
function marksClass($info) {
    return ($info > 60) ? "pass" : "fail";
}

function positionLink($experience) {
    return ($experience > 3)
        ? '<a href=
http://pixelcom.crimea.ua/"#">Apply for Senior Software Engineer</a>'
        : '<a href=
http://pixelcom.crimea.ua/"#">Apply for Software Engineer</a>';
}

function salaryClass($experience, $salary) {
    switch ($experience) {
        case 1:
            return ($salary < 5000) ? "accept" : "reject";
        case 2:
            return ($salary < 10000) ? "accept" : "reject";
        case 3:
            return ($salary < 20000) ? "accept" : "reject";
        default:
            return ($salary < 50000) ? "accept" : "reject";
    }
} 



Теперь давайте сделаем это с помощью phpQuery, сравним код и преимущества.



<?php
require("phpQuery/phpQuery.php");
$doc = phpQuery::newDocument('<div id="main"></div>');
phpQuery::selectDocument($doc);

// retrieve applicants from database
//...

$doc["#main"]->append('
<div id="main">
 <div class="row_head">
  <div>Name</div>
  <div>Marks</div>
  <div>Experience</div>
  <div>Position</div>
  <div>Expected Salary</div>
 </div>');

foreach ($applicants as $key => $applicant) {
    $doc["#main"]->append('<div class="row" id="app_' . $key . '"></div>');
    foreach ($applicant as $field => $info) {
        $doc["#main"]->find("#app_" . $key)->append('<div class="_' . $field . '">' . $info . "</div>");
        if ($field == "experience") {
            $doc["#main"]->find("#app_" . $key)->append('<div style="width:400px" class="_position">-</div>');
        }
    }
}

addMarksClass($doc);
addSalaryClass($doc);
addPositionLink($doc);

print $doc;

function addMarksClass(&$doc) {
    $marks = pq("._marks");
    foreach ($marks as $appMark) {
        if (pq($appMark)->html() > 60) {
            pq($appMark)->addClass("pass");
        }
        else {
            pq($appMark)->addClass("fail");
        }
    }
}

function addSalaryClass(&$doc) {
    $marks = pq("._salary");
    foreach ($marks as $appMark) {
        $experience = pq($appMark)->parent()->find("._experience" )->html();
        $salary = pq($appMark)->html();

        switch ($experience) {
            case 1:
                pq($appMark)->addClass(
                    ($salary < 5000) ? "accept" : "reject"
                );
                break;
            case 2:
                pq($appMark)->addClass(
                    ($salary < 10000) ? "accept" : "reject"
                );
                break;
            case 3:
                pq($appMark)->addClass(
                    ($salary < 20000) ? "accept" : "reject"
                );
                break;
            default:
                pq($appMark)->addClass(
                    ($salary < 50000) ? "accept" : "reject"
                );
        }
    }
}

function addPositionLink(&$doc) {
    $experience = pq("._experience");
    foreach ($experiece as $appExp) {
        if (pq($appExp)->html() > 3) {
            pq($appExp)->parent()->find("._position")->html('<a href=
http://pixelcom.crimea.ua/"#">Apply for Senior Software Engineer</a>');
        }
        else{
            pq($appExp)->parent()->find("._position")->html('<a href=
http://pixelcom.crimea.ua/"#">Apply for Software Engineer</a>');
        }
    }
} 



Хочу отметить, что pq() ссылается на текущий документ. Все остальные функции jQuery.

На первый взгляд код выглядит одинаково, но код который использует phpQuery обеспечивает лучшее качество и гибкость. Предположим, нам нужно добавить дополнительную проверку абитуриентов на основе опыта работы. В js вам придется добавить еще один метод и присвоить возвращаемый результат внутри foreach цикла. Это означает, что вы должны изменить уже написанный код, нарушая открыто-замкнутых принцип :

Программное обеспечение (классы, модули, функции и т.д.) должны быть открыты для гибкости, но закрыты для модификации.

Пример который использует phpQuery, подготовлен ​​без проверки, а затем мы переходим к таблицам в каждой функции и изменения находятся в исходной таблице. Каждая функция не влияет на другие функции, поэтому мы можем написать новую функцию для каких-либо новых требований и использовать его вне цикла с другими функциями. Мы не изменяем уже существующий код, который хорошо звучит, правда? Это называется сокращение .

Заключение

После простого примера phpQuery, вы должны были понять как использовать phpQuery, и как phpQuery улучшает качество кода. phpQuery дал нам новые перспективы для работы с HTML на стороне сервера, и надеюсь, вы будете использовать phpQuery, и поделитесь своим личным опытом в комментариях ниже.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML -теги и атрибуты: <a href= http://pixelcom.crimea.ua/"" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>