PHP:如何获取CURRENT innerHTML



简单地说,我试图创建一个用户可以制作元素的网站,然后将其放入id为"box"的div元素中。js脚本运行得非常好,并且可以创建p元素。

然后,我制作了一个php脚本,保存"box"div的innerHTML,然后将其保存在.txt文件中。

现在,问题是,在添加p元素之前,脚本将innerHTML值作为原始值返回。

这是我的php脚本:

<?php
//Basically a function
if(isset($_POST["use_button"]))
{
//Loads the file, which is named test.php
$dom= new DOMDocument(); 
$dom->loadHTMLfile("test.php"); 
//Gets the innerhtml value
$div = $dom->getElementById("box")->nodeValue;
//Writes it down in a file.
$file = fopen("stuff.txt","w");
fwrite($file,$div);
fclose($file);
//Just for fast-checking if the code has any errors or not
echo "File saved.";
}
?>

我想这个问题已经很清楚了。这就是如何获得CURRENT值而不是ORIGINAL值。

如果有帮助的话,下面是整个代码:

<html>
<head>
<script>
//The javascript function to add a "para" into a div with the id "box"
function addstuff() {
var parag = document.createElement("P");        // Create a <button> element
var t = document.createTextNode("Lorem Ipsum");       // Create a text node
parag.appendChild(t);
document.getElementById("box").appendChild(parag);
}
</script>
</head>
<body>

<!--Button to call the funtion-->
<button onclick="addstuff()">Add it</button>

<!--The form for the button to work-->
<form action="" method="post">
<!--The div to put the "para"s in. The style only adds borders-->
<div id="box" style="border: 2px solid black;">
<!--A pre-existing paragraph-->
<p>This was here before</p>
</div>
<!--The button to call the php-->
<input type="submit" name="use_button" value="Store in file" style="width:100%;" />
</form>
<!--The PHP-->
<?php
//Basically a function
if(isset($_POST["use_button"]))
{
//Loads the file, which is named test.php
$dom= new DOMDocument(); 
$dom->loadHTMLfile("test.php"); 
//Gets the innerhtml value
$div = $dom->getElementById("box")->nodeValue;
//Writes it down in a file.
$file = fopen("stuff.txt","w");
fwrite($file,$div);
fclose($file);
//Just for fast-checking if the code has any errors or not
echo "File saved.";
}
?>
</body>
</html>

这是不可能的:

  • PHP生成HTML,然后将其发送到浏览器
  • 浏览器在页面中执行javascript

浏览器中没有PHP!服务器无法知道用户在浏览器中所做的任何事情!!

您可以使用javascript进行AJAX调用,将数据发送到服务器。

请参考此答案:https://stackoverflow.com/a/6009208/1275832

您似乎对<form>元素的工作方式感到困惑。仅仅向表单客户端添加HTML代码并不会在表单提交时将HTML代码作为表单数据发送到服务器。它也不会自动更新一些PHP文件。

您需要将HTML代码添加到<form>的某个输入控件(input、textarea等)中。然后,该输入的值将在提交时发送到服务器,此时您可以使用发送的数据。

因此,在客户端,您可以有一个隐藏的输入,它将保存要发送的html。每次需要更改html 时都会更新它

HTML

<form action="" method="post">
<input id="boxinput" type="hidden" name="boxinput"/>
<!--- Rest of form -->
</form>

JS-

//cache these so you don't need to call getByElementById every call
var box = document.getElementById("box");
var boxinput = document.getElementById('boxinput');
function addstuff() {
var parag = document.createElement("P");
var t = document.createTextNode("Lorem Ipsum");
parag.appendChild(t);
box.appendChild(parag);
//update the input field
boxinput.value = box.innerHTML;  
}

然后在服务器端,从$_POST全局获取输入数据,并根据需要使用

if(isset($_POST["use_button"])) {
$boxHtml = $_POST['boxinput'];
//..
fwrite($file,$boxHtml);
//..
}

必须注意的是:如果你打算以某种方式使用这个保存的html,例如在某个新页面上回显它,你应该在保存/使用它之前对它进行消毒。或者只在沙盒框架中显示它(有点像Stack Overflow对其Stack Snippets进行沙盒处理)

这是不可能的。

但您可以使用phpjavascript中相同的query parameters手动处理它

通过query parameters生成页面元素。

例如,当您让test.php?div=box生成一个包含<div id='box'>的页面时

像这样的解决方案太多了

最新更新