php - 通过 AJAX 和 PHP 进行简单的实时 HTML 编辑

Question

我正在尝试建立一个简单的小网站，我可以在其中编辑数字。此更改 (onblur) 将通过 AJAX 发送到 PHP 脚本，将编辑后的数字写回到 HTML 文件中。

我已经做到了这一点，但无法让 PHP 和 DOMXpath 工作。

网站(index.html):

<div class="actualcount" contenteditable="true">254</div>

Javascript:

$.ajax({
     url: "save.php",
     type: "POST",
     data: {postdata: $(".actualcount").html()} ,
})

PHP:

<?php
     $editData = $_POST['postdata'];
     $newText = '<div class="actualcount" contenteditable="true">'.$editData.'</div>';
     $html = file_get_contents('index.html');
     $dom = new DOMDocument;
     $dom->loadHTML($html);
     $xpath = new DOMXPath($dom);
     $actualcount = $xpath->query('//*[@class="actualcount"]')->item(0);
     $actualcount->parentNode->replaceChild($newText, $actualcount);
     $dom->saveHTMLFile("index.html");
?>

它给了我一个

Fatal Error: Uncaught TypeError: Argument 1 passed to DOMNode::replaceChild() must be an instance of DOMNode, string given ...

感谢您的热心帮助。

Answer 1

replaceChild 接受 2 个节点元素作为参数，您传递的第一个是一个字符串!您需要创建一个元素。

这是一个简单的示例，说明如何使用 DOMDocument::createElement 执行此操作和 DOMElement::setAttribute

<?php
     if(isset($_POST['postdata'])) {
         $editData = (string) $_POST['postdata']; 
     } else {
         $editData = '';
     }

     $html = file_get_contents('index.html');
     $dom = new DOMDocument;
     libxml_use_internal_errors(true);
     $dom->loadHTML(mb_convert_encoding($html, 'HTML-ENTITIES', 'UTF-8'));
     libxml_clear_errors();
     $xpath = new DOMXPath($dom);
     $actualcount = $xpath->query('//*[@class="actualcount"]')->item(0);
     $newnode = $dom->createElement('div', $editData); 
     $newnode->setAttribute("class", "actualcount");
     $newnode->setAttribute("contenteditable", "true");
     $actualcount->parentNode->replaceChild($newnode, $actualcount);
     $dom->saveHTMLFile("index.html");
?>