2

我想将这些片段放在几个 php 文件中，然后在我的主页中需要它们，而不是使用“纯”css 和 js 文件。我的意思是，我基本上已经为我的 HTML DOM 做了这个。

这个：

<script type='text/javascript'>
var foo = <?php echo $bar; ?>;
</script>

或这个：

<style type='text/css'>
.foo{
background-image:url('<?php echo $bar; ?>image.png');
}
</style>

这真的是不好的做法吗？

如果是，这种方法的优缺点是什么？

更新：

这些天我只是在使用 Drupal，它处理将 PHP 变量传递给主题系统中的 js，并支持 CSS 预处理器，如 LESS 和 SASS。我在这个问题中提出的两个用例都被现代框架/预处理器很好地处理了。

4

4 回答 4

5

通过 PHP 解释器放置 Javascript 可能不是一个好主意。同样，CSS

  • 它鼓励使用服务器端代码编写客户端代码的反模式
  • 这使得单独测试 JS 和 CSS 变得更加困难（如果它们开始充满 PHP 代码）
  • 它使 PHP 输出更大
  • 客户端不会缓存页面的一部分，只会缓存整个对象

扩展最后一部分 - Javascript 和 CSS 可以变得很大（与 HTML 相比）。如果您有客户端浏览器缓存它们，则不需要下载它们。

确实，包含在主文档中意味着没有单独的请求可以减少开销（特别是使用 SSL），但客户端仍然需要下载文件。让它来自客户端缓存通常更快。

另一方面，您的代码

<script type='text/javascript'>
var foo = <?php echo $bar; ?>;
</script>

看起来它是一段数据，而不是 Javascript 代码，所以它可能会有所不同。您可能还想正确转义 $bar。

于 2010-02-22T07:29:31.060 回答
2

Although CSS is not a problem, you'd have trouble if you wanted to send this as an HTTP response via AJAX.

<script type='text/javascript'>
var foo = <?php echo $bar; ?>;
</script>

AJAX won't allow Javascript for security reasons.

Best practice is to keep your Javascript in a separate file. That way client-side caching of the script will be to your advantage in terms of traffic too.

于 2010-02-22T09:17:55.943 回答
1

我不认为这有什么不好的。对于某些人来说，这将是一个眼睛痛，但没关系。请确保将这种集成保持在最低限度，您真的不希望在您的 css、javascript 和 html 中穿插大量 php。

于 2010-02-22T07:24:34.220 回答
0

按照 MarkR 的线程（看不到如何回复它），假设您只是尝试将数据传递给 JS：

您可以获得两全其美的一种方法是在该 PHP 位中包含一些逻辑，以便它检查某个 cookie 并使其具有某个值（例如版本/时间）。喜欢：

if (!isset($_COOKIE['warm']) && $_COOKIE['warm'] !== 'today') {
    echo '<script type=\'text/javascript\'>';
        echo "var foo = $bar;";
    echo '</script>';
}

客户端将首先查找 foo 全局变量，如果它存在，它将获取并缓存它（例如 localStorage）并设置一个带有时间或版本或 foo 对象的某些属性的 cookie。如果 foo 不存在，那么它将检查缓存（例如 localStorage）。如果它不存在，那么它将为它进行 AJAX 调用。

通过这种方式，您可以将额外的请求保存在缓存未命中/首次访问者上，并从他们的重复中获得缓存优势。不应该对它发疯，但我认为它对于小的重要数据对象（引导程序、用户配置文件、仪表板信息等）应该没问题。

（编辑）明确地说，保持这种方法易于实现和维护的中心思想是将生成 $bar 的服务器端代码保存在一个地方，当 PHP 打印出 var foo 和生成JSON 响应。同样，客户端将使用一个函数来解析 $bar，无论它来自 var、缓存还是 AJAX。

于 2012-09-21T05:37:20.927 回答