如何在页面中间附加 <head> 和 PHP？

Question

我有一个 HTML "chunk" 的代码，里面有 HTML 和 JS 所以我可以很容易地 include它与 PHP。我也希望它具有 CSS 样式 但根据标准，您“allowed” 不能这样做 - 虽然它有效使页面无效。 CSS 只允许在 <head> 中使用，而不能在页面中间使用（至少在 HTML5.2 之前）。所以我考虑在头部附加类似命名但单独的 .css 文件，但 PHP 和 而不是 JS （为了性能起见）

<head>
<!-- PHP needs to include button.css here AFTER $App->INC("button"); has been called -->
</head>

<body>
<?php
$App->INC("button");
//This basically does 'require_once("button")';
//What do I need to add to the INC method to include css file in the head?
//Similar to $("head").append() but with PHP
?>
</body>

css 同名文件应添加到 <head> 部分。

PS: 这似乎是一个设计缺陷，也可能是，但这是其背后的想法。

我有一段代码，如果包含在 body 生成一个 "loading screen" （或其他 UI 元素 can't/shouldn 不能嵌套在其他任何地方，只能嵌套在 <body> 网站。
它在单独的文件中有样式
我发给其他用户
他们将它包含在一个 "App" class 的方法中，它只做两个事情：包括文件本身和附近的css文件
然后他们只用1行代码就把它放在他们想要的地方，然后不在其他 2-3 个地方，因此代码更易于管理

示例：

Answer 1

你可以试试这个：

<?php
ob_start();
$App->INC("button");
$button = ob_get_clean();
?>
<head>
<!-- Do your inclue here -->
</head>

<body>
<?= $button ?>
</body>

您可以通过 INC() 方法将 ob_start() / ob_get_clean() 内容放入 button.php 和 return 内容中。然后你可以像这样将内容直接保存到$button中：$button = $App->INC("button");.

但是你的例子看起来像是一个设计问题。不过，我希望这能奏效。

这可能是重新设计：

<?php

$App->loadModule('button'); // Loads the module, the module registers stylesheets and content.

$App->loadModule('another_module'); // Load more modules ...

<head>
<?php $App->renderModuleStylesheets(); ?>
</head>

<body>
<?php $App->renderModuleContent(); ?>
</body>

Answer 2

如果您直接在组件本身中包含 CSS，或者期望组件动态加载相关的 CSS，那么维护或自定义可能会相当困难。我并不是说你不应该走这条路，而是要小心不要让你的组件做太多事情。

评论中指出的挂钩系统是处理此问题的一种方法。

另一种简单的方法是提供用户可以覆盖的默认样式。这可能是允许每个组件使用不同样式的最简单方法。

<head>
<!-- Provide some defaults. Users should not customize this one. -->
<link rel="stylesheet" type="text/css" href="default.css">

<!-- User's can customize this file to override the default styling.-->
<link rel="stylesheet" type="text/css" href="custom.css">
</head>

<body>
<?php $App->INC("button"); ?>
</body>

button.php——只负责渲染一个按钮。单独的 CSS 文件将实际设置样式。

<?php
echo <input type"submit" class="button" value="Submit">

default.css - 应用默认样式

.button {
    color: blue;
}

custom.css - 覆盖默认样式

.button {
    color: red;
}

最后请注意，您可能还想研究使用子视图继承的主模板文件。这有助于减少 link 到 CSS 文件的完整 HTML 文件的数量。这个想法是有 1 个（或几个）模板文件，视图将自己注入其中。这是一些伪代码。

frontend.php

<html>
<head>
<!-- Links to CSS files here. -->
</head>

<body>
<?php $placeholder('body'); ?>
</body>

Login.php

<?php inherits('frontend.php')->body; ?>
<form id="login">
...

Register.php

<?php inherits('frontend.php')->body; ?>
<form id="register">
...

大约-Us.php

<?php inherits('frontend.php')->body; ?>
<p>About Us</p>
...

如何在页面中间附加 <head> 和 PHP？

How to append to <head> with PHP in the middle of the page?

html

css

php

head