Я пытаюсь применить CSS к DOMDocument, созданному через PHP. Однако, даже когда я использую jQuery для применения стилей, он не работает. Вот пример, который у меня есть:
<div id="content">
<p class="intro">Below are some of the YouTube videos I've made.
<br />Feel free to take a look!</p>
<div id="video-content">
<?php include '../resources/php/functions.php';
$functions=new Functions;
$functions->getVideos();
?>
<script type="text/javascript">
$(window).load(function() {
$('iframe-video').css({
"margin-left": "auto"
});
$('iframe-video').css({
"margin-right": "auto"
});
$('iframe-video').css({
"margin-bottom": "35px"
});
});
</script>
</div>
$functions->getVideos();
успешно возвращает видео, и они отображаются. Им также предоставляется класс iframe-video. Однако вышеприведенный CSS на самом деле не применяется к нему.
Как я могу изменить CSS элементов, сгенерированных PHP DOMDocument?
PHP-код выглядит следующим образом:
public function getVideos() {
$doc = new DOMDocument;
libxml_use_internal_errors(true);
$doc->loadHTMLFile('http://www.youtube.com/user/HathorArts/videos');
libxml_use_internal_errors(false);
$xpath = new DOMXPath($doc);
$nodes = $xpath -> query('//a[@class="ux-thumb-wrap yt-uix-sessionlink yt-uix-contextlink yt-fluid-thumb-link contains-addto "]');
// Get the URLS for the videos, and build the iFrames for them.
$output = new DOMDocument;
foreach($nodes as $i => $node) {
// Creates the video URL for the iFrame
$temp_url = $node->getAttribute('href');
$replace_url = str_replace("/watch?v=", "", $temp_url);
$video_url = ("//www.youtube.com/embed/" . $replace_url . "?rel=0");
// Builds the iFrme
$iframe = $output->createElement('iframe');
$iframe->setAttribute('class', 'iframe-video');
$iframe->setAttribute('width', '560');
$iframe->setAttribute('height', '315');
$iframe->setAttribute('src', $video_url);
$iframe->setAttribute('frameborder', "0");
// Outputs the iFrame
$output->appendChild($iframe);
}
// Sends the output to the index file
echo $output -> saveHTML();
}
Если у вас есть файл CSS, просто добавьте свойства для .iframe-video
. PHP не имеет ничего общего с CSS, только выход HTML.
Измените несколько строк в коде скрипта; то он будет работать:
<script type="text/javascript">
$(document).ready(function() {
$('.iframe-video').css({
"margin-left": "auto"
});
$('.iframe-video').css({
"margin-right": "auto"
});
$('.iframe-video').css({
"margin-bottom": "35px"
});
});
</script>
Это определенно сработает.
Вы должны задержать код JavaScript после загрузки страницы следующим образом:
window.onload = function () { ... }
$('iframe-video')
должно быть$('.iframe-video')
???