PHP 中 nodeValue 和 saveHTML() 的 DOMDocument() 問題

Question

我正在使用 Joomla CMS，我想在渲染中操作 DOM。 我想修改內聯腳本以在頁面加載時執行。 但是我遇到了一個谷歌地圖腳本的問題，它的代碼中有 HTML 標記，當我嘗試使用nodeValue獲取腳本的內容時，它會在第一次關閉</div>時將其切斷； 我還嘗試不修改任何內容，只需加載 HTML 然后使用saveHTML()保存它，同樣的問題也會發生。

部分頁面代碼（page.html）

<!DOCTYPE html>
<html>
<head>
    <title>Page title</title>
    <script src="https://maps.googleapis.com/maps/api/js?key=XXXXXX" type="text/javascript"></script>
</head>
<body>
<header></header>
<main>
    <div class="wrapper">
        <div class="inner">
            <div class="map-container">
                <div class="google-map">
                    <div id="map-canvas95" class="map-canvas" style="width:100%;height:400px">
                        <script type="text/javascript">
                            //API demos Used(synchronous loading, info window,)
                            var myLatlng95 = new google.maps.LatLng(-11.926755,-77.05359);
                            var mapOptions95 = {
                                scrollwheel: false,
                                zoom: 15,
                                center: myLatlng95,
                                disableDefaultUI: true,
                                mapTypeId: google.maps.MapTypeId.ROADMAP,
                                mapTypeControl: true,
                                mapTypeControlOptions: {
                                    style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                                    position: google.maps.ControlPosition.LEFT_TOP
                                },
                                panControl: true,
                                panControlOptions: {
                                    position: google.maps.ControlPosition.LEFT_CENTER
                                },
                                zoomControl: true,
                                zoomControlOptions: {
                                    style: google.maps.ZoomControlStyle.SMALL,
                                    position: google.maps.ControlPosition.LEFT_CENTER
                                },
                                scaleControl: true,
                                streetViewControl: true,
                                streetViewControlOptions: {
                                    position: google.maps.ControlPosition.LEFT_CENTER
                                }
                            };
                            var map95 = new google.maps.Map(document.getElementById('map-canvas95'), mapOptions95);

                            //Info Window
                            var contentString95 = '<div id="content">'+
                                '<div id="siteNotice"></div>'+
                                '<h1 id="firstHeading" class="firstHeading">Market Title</h1>'+
                                '<div id="bodyContent">'+
                                    '<p>Graphic Design. Lorem ipsum dolor sit amet, consectetur adipiscing elit. of Quisque ultricies vestibulum molestie.</p>'+
                                '</div>'+
                            '</div>';
                            var infowindow95 = new google.maps.InfoWindow({
                                content: contentString95,
                                maxWidth: 300
                            });
                            
                            //Marker
                            var marker95 = new google.maps.Marker({
                                position: myLatlng95,
                                map: map95,
                                title: 'Market Title'           });

                            //Event for open Info Window
                            google.maps.event.addListener(marker95, 'click', function() {
                                infowindow95.open(map95,marker95);
                            });
                        </script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
<footer></footer>
</body>
</html>

我的 DOM 腳本

    //$app = JFactory::getApplication('site'); for Joomla only
    //$body = $app->getBody(false);//for Joomla only
    $body = file_get_contents('page.html');
    $domDoc = new DOMdocument();
    libxml_use_internal_errors(true);
    $domDoc->loadHTML($body);
    libxml_clear_errors();
    $scripts =$domDoc->getElementsByTagName('script');
    $openScript = "\nwindow.addEventListener('DOMContentLoaded', function() {";
    $closeScript = "});\n";
    foreach ($scripts as $script) {
        $newScript = $openScript.$script->nodeValue.$closeScript;
        $script->nodeValue = (!empty($script->nodeValue)) ? $newScript : $script->nodeValue;
    }
    //$body = $domDoc->saveHTML();  for Joomla  
    //$app->setBody($body);for Joomla
    $domDoc->saveHTMLFIle('newDom.html');

在結果文件中，您可以看到腳本被剪切

<script>
  window.addEventListener('DOMContentLoaded', function() {    
  var contentString<?php echo $uniqid; ?> = '<div id="content">'+
  '<div id="siteNotice"></div>;
  });
</script>

就像這個谷歌地圖腳本一樣，我也看到了其他代碼中包含 HTML 標記的腳本。 我該如何解決這個問題？ 謝謝。

Answer 1

ext/dom不支持 HTML5 。 您可以使用HTML5-PHP庫。 它將 HTML5 讀入 XHTML DOM。

use \Masterminds\HTML5;

$html5 = new HTML5();
$document = $html5->loadHTML(getHTML());
$xpath = new DOMXpath($document);
// register namespace prefix for Xpath expressions 
$xpath->registerNamespace('xhtml', 'http://www.w3.org/1999/xhtml');

foreach ($xpath->evaluate('//xhtml:div[@class="google-map"]//xhtml:script') as $script) {
    $script->textContent = "\nwindow.addEventListener('DOMContentLoaded', function() {\n{$script->textContent}\n});\n";
}
echo $html5->saveHTML($document);

此外，不要使用DOMNode::$nodeValue而是使用DOMNode::$textContent來確保正確處理特殊字符。

PHP 中 nodeValue 和 saveHTML() 的 DOMDocument() 問題

問題描述

1 個解決方案

解決方案1
2 2020-12-02 13:59:34

PHP 中 nodeValue 和 saveHTML() 的 DOMDocument() 問題

問題描述

1 個解決方案

解決方案1 2 2020-12-02 13:59:34

解決方案1
2 2020-12-02 13:59:34