结合jQuery和Zen-Coding php端口在服务器端脚本上模拟客户端编程风格

| 在编写客户端代码时，我使用HTML / CSS / JavaScript和最近的jQuery来加快编码速度，并使用改进的方法来实现相同的目标。 在我的文本编辑器中，我使用zen-coding来加快代码编写速度，并避免错误。我曾经将zen-coding作为jQuery插件使用了一段时间，但是它有一个致命的缺陷，那就是您希望在编写任何javascript脚本之前先编写HTML并将其发送到客户端。 尽管我们可以使用JavaScript服务器（env.js或node.js），因此可以使用JavaScript和jQuery进行很多开发服务器端的工作，但由于它是一种新兴技术，因此我仍不满意，因为它具有许多差异和缺点（以及一些主要优势）。 我想继续使用PHP服务器端，但是以我最熟悉的方式进行开发，并且最熟悉的是客户端JavaScript。 因此-我一直在研究QueryPath，它是jQuery的PHP端口，旨在采用jQuery的最佳和最相关部分，并对其进行重新设计以适合服务器环境。 太好了，我现在一直在研究能够解析zen-coding的两个PHP类，将它们组合使用时，它们可以充当强大的模板引擎，还可以避免代码中的错误。 我遇到的问题是，禅宗编码解析器都不支持接近整套禅宗编码功能的任何地方。 所以最后我的问题（抱歉，冗长的介绍） 我可以在PHP代码中使用更好的服务器端zen编码解析器吗？ 是否有使用zen编码的好的（非常简洁和功能齐全的）替代模板系统？ （我知道这并不是最初为完成此任务而设计的） 我是否应该有更好的方法来实现缩小客户端和服务器端编码方式之间的鸿沟的最终目标？ 是否有一个PHP库实现了许多实用程序功能，通过使用这些库，可以提高我的代码的安全性/性能，而无需我学习所有内部工作原理？ （就像jQuery在javascript中一样） 注意：我更希望功能对等而不是句法相似性-尽管两者对我来说都是加分项。 这是一些注释过的测试代码，应该可以阐明我正在尝试实现的目标： 
<?php

    // first php based zen-coding parser
    // http://code.google.com/p/zen-php
    require_once \'ZenPHP/ZenPHP.php\';
    // my own wrapper function
    function zp($abbr){ return ZenPHP::expand($abbr); }

    // second php based zen-coding parser
    // https://github.com/philipwalton/PW_Zen_Coder
    require_once \'PW_Zen_Coder/PW_Zen_Coder.php\';
    $zc = new PW_Zen_Coder;
    // my own wrapper function
    function pwzc($abbr){ global $zc; return $zc->expand($abbr); }

    // php port of jQuery with a new server-side flavor
    // http://querypath.org/
    require_once \'QueryPath/QueryPath.php\';

    // initialize query path with simple html document structure
    qp(zp(\'html>head+body\'))

        // add a heading and paragraph to the body
        ->find(\'body\')
        ->html(zp(\'h1{Zen Coding and jQuery - Server Side}+p{This has all been implemented as a php port of JavaScript libraries}\'))

        // add a comments link to the paragraph
        ->find(\'p\')
        ->append(pwzc(\'span.comments>a[href=mailto:this@comment.com]{send a comment}\'))

        // decide to use some jquery - so add it to the head
        ->find(\':root head\')
        ->append(zp(\'script[type=text/javascript][src=/jquery.js]\'))

        // add an alert script to announce use of jQuery
        ->find(\':root body\')
        ->append(zp(\'script[type=text/javascript]{$(function(){ alert(\"just decided to use some jQuery\") })}\'))

        // send it to the browser!
        ->writeHTML();

    /* This will output the following html

    <html>
    <head>
    <script type=\"text/javascript\" src=\"/jquery.js\"></script>
    </head>
    <body>
    <h1>
        Zen Coding and jQuery - Server Side
    </h1>
    <p>
        This has all been implemented as a php port of JavaScript libraries
    <span class=\"comments\">
        <a href=\"mailto:this@comment.com\">

            send a comment
        </a>
    </span>
    </p>
    <script type=\"text/javascript\">
        $(function(){ alert(\"just decided to use some jQuery\") })
    </script>
    </body>
    </html>

    */
?>
任何帮助深表感谢     
2020-05-02 6 条评论
分享

没有找到相关结果

    已邀请:

    犀寺扦

    首先，我想说我已经对您的回答投了赞成票，因为它得到了很好的解释并且值得考虑。那我想让您考虑一下这些问题： 戈塔斯 恕我直言，你让整个事情变得复杂了；） 在生成HTML所需的整个PHP代码与输出的HTML本身之间，在编写代码的长度方面，差异非常小。 对于不了解这3个库或其他任何3个库的每个人，该代码是完全不可行的。 与普通HTML相比，网站加载速度将大大降低。 之间的真正区别是什么： 
    h1{Zen Coding and jQuery - Server Side}+p{This has all been implemented as a php port of JavaScript libraries}
    和 
    <h1>Zen Coding and jQuery - Server Side</h1><p>This has all been implemented as a php port of JavaScript libraries</p>
    6 ..如您所知，zen-coding和queryPath都不打算以您的方式使用，至少在生产场景中不这样。 7 .. jQuery有一个很好的文档并且可以使用，这并不意味着任何人都可以成功使用它。 （仅复制/粘贴不视为IMO的编码技能） 解 对于看诸如smarty之类的PHP模板引擎，这可能是最好的解决方案，它将以多种方式满足您的需求： 安全/性能 缩小我在客户端和服务器端编码方式之间的鸿沟 一个示例将是：（被认为是一个非常原始的示例，smarty具有更强大的功能） 
    <!-- index.tpl -->
<html>
  <head> {$scriptLink} 
  </head>
  <body> <h1> {$h1Text} </h1>
    <p> {$pText} 
      <span class=\"comments\">
        <a href=\"{$aLink}\"> {$aText} </a>
      </span>
    </p> {$scriptFunc} 
  </body>
</html>

        // index.php
    require(\'Smarty.class.php\');
    $smarty = new Smarty;
    $smarty->assign(\"scriptLink\", \"<script type=\\\"text/javascript\\\" src=\\\"/jquery.js\\\"></script>\");
    $smarty->assign(\"scriptFunc\", \"<script type=\\\"text/javascript\\\">$(function(){ alert(\\\"hello world\\\") });</script>\");
    $smarty->assign(\"h1Text\", \"Zen Coding and jQuery - Server Side\");
    $smarty->assign(\"pText\", \"This has all been implemented as a php port of JavaScript libraries\");
    $smarty->assign(\"aText\", \"send a comment\");
    $smarty->assign(\"aLink\", \"mailto:this@comment.com|mailCheck\");
    $smarty->display(\'index.tpl\');
    注意：使用
    mailCheck
    ，是的，您还应该考虑可能的某种变量检查。聪明的人可以做到。 希望对您有所帮助。 ;）     
    2020-05-02 0 0
    分享

    肉簧咸缮

    问题1和2 类似于ZenCoding示例的模板引擎将是Haml。语法是不同的，但类似地，它简短且总体上十分简洁。 如果您喜欢使用ZenCoding，可以考虑使用支持它的编辑器。例如，PhpStorm默认情况下捆绑了ZenCoding插件。我确定其他人（例如Vim）也有用于此目的的插件。但是，这种方法只允许您编写它：编写完之后，编辑器会将其扩展为实际的HTML标记。 问题3 我认为这个问题的一部分是，它们本质上是完全不同的东西。在客户端脚本方面，它通常只是一个用户界面。浏览器UI使用某些编程风格和方法。但是，在服务器端，通常需要进行数据处理，对于数据处理，其他类型的模式可以更好地工作。 我有点怀疑您使用的QueryPath是否是一个特别好的选择……似乎使HTML标记本身有些晦涩难懂，这使得很难看到操作的确切结果。 为了在服务器端生成HTML标记，我建议使用模板引擎或仅使用仅PHP的模板。 您可以使用的一种方法是完全放弃服务器端标记的生成。当然，这并不是所有事情的好主意，但是对于复杂的Web应用程序（采用Gmail或类似样式），您可以仅使用JavaScript生成整个标记。在服务器上，您将仅使用JSON返回数据。这样，您就不必在服务器上处理标记，并且可以在整个过程中继续使用jQuery或客户端上的任何内容。 问题4 再次，我对整个事情有点怀疑。如果您不了解幕后情况，那么如何生成好的代码？如果出现错误或无法正常工作，您如何正确理解或调试它们？ 现在，我不知道您是否是PHP专家，但就我个人而言，我建议您学习如何使用PHP。不过，您不必从头开始编写所有内容。选择一个框架是一个好主意，它将完全按照您的要求进行操作：它将为您做很多事情，因此您不必担心安全性或其他事情。 我个人建议使用Zend Framework，因为它提供了广泛的组件，并且您只需要使用所需的部分-您不必一次使用整个框架。但是，一开始它可能会有些复杂，特别是如果您对PHP和OOP概念不太熟悉，那么一开始使用其他框架可能会更好。     
    2020-05-02 0 0
    分享

    降女陷费券

    我不确定要了解您的问题，但是我通常有以下简单方法： 
    <?php

ob_start();

$config->js[] = \'js/jquery.js\';

?>

<h1>
    <del>Zen Coding and jQuery - Server Side</del>
    <ins>HTML and PHP :-)</ins>

</h1>
<p>
    This has all been implemented <del>as a php port of JavaScript libraries</del> 
    <ins>in php</ins>
<span class=\"comments\">
    <a href=\"mailto:this@comment.com\">
        send a comment
    </a>
</span>
</p>
<script type=\"text/javascript\">
    $(function(){ alert(\"just decided to use some jQuery\") })
</script>

<?php $content = ob_get_clean() ?>

<?php require \'layout.php\' ?>
    一些要点： 
    ob_start
    打开输出缓冲区（输出未发送到客户端，而是存储在内部缓冲区中） 
    $config->js[] = \'js/jquery.js\';
    会说要在布局中添加新的脚本标签 然后是必须用布局装饰的纯HTML 
    <?php $content = ob_get_clean() ?>
    获得存储在内部缓冲区中的输出，并将其分配给变量。 “ 10”将包括具有主要HTML结构的布局以及一些用于打印metas，标题，“ 11”标签，“ 12”标签等的逻辑。该布局将包含“ 13”来打印页面内容。 可以将点1、4和5委派给前端控制器，因此视图可以只是： 
    <?php

$config->js[] = \'js/jquery.js\';

?>

<h1>
    <del>Zen Coding and jQuery - Server Side</del>
    <ins>HTML and PHP :-)</ins>

</h1>
<p>
    This has all been implemented <del>as a php port of JavaScript libraries</del> 
    <ins>in php</ins>
<span class=\"comments\">
    <a href=\"mailto:this@comment.com\">
        send a comment
    </a>
</span>
</p>
<script type=\"text/javascript\">
    $(function(){ alert(\"just decided to use some jQuery\") })
</script>
        
    2020-05-02 0 0
    分享

    抽法

    我认为您完全错过了ZenCoding的要点。 ZenCoding旨在集成到您的编辑器中，而不是您的应用程序中。这是一种使用更少的击键和更少的错误来快速编写HTML的方法。您评论的测试代码对我而言似乎并不可用。我更喜欢纯HTML版本。 如果编写普通HTML的速度和质量对您来说是个问题，也许是时候改用更好的编辑器了吗？一种支持ZenCoding，自动平衡HTML标签，自动补全，摘要/模板等功能的工具？我已经配置Vim为我完成所有这些工作。有人告诉我StormPHP也相当不错。     
    2020-05-02 0 0
    分享

    羔磺

    我是QueryPath的作者，因此我的答案有很大的偏见，但我喜欢您要尝试做的事情。 （看到我的代码以我从未想到的方式使用总是很激动。） QueryPath具有扩展机制。使用它，您可以将方法直接添加到QueryPath。因此，例如，您可以编写一个简单的插件，使您可以将replace15ѭ替换为
    qp()->zp($selector, $zencode);
    。 您可以看一下
    QueryPath/Extensions
    中的扩展，并查看它们的工作方式。 （
    QPXML.php
    很容易让人gr舌。） 如果您确实要建立（发布）解决方案，请告诉我。     
    2020-05-02 0 0
    分享
    为什么被折叠? 0 个回复被折叠

    要回复问题请先登录或注册

    或代码 OrCode.com 备案号：粤ICP备15020848号-1
    Escape time: 0.062587976455688