I have a simple form where you can upload an html file, its structure looks like this:
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml" lang="he" xml:lang="he" dir="rtl">
<head>
<title>test</title>
<link rel="stylesheet" href="../Styles/cssreset-min.css" type="text/css"/>
<link rel="stylesheet" href="../Styles/page_styles.css" type="text/css"/>
<link rel="stylesheet" href="../Styles/style.css" type="text/css"/>
</head>
<body id="start">
<img src="../Images/cover.jpg" class="images" alt="Image 1"/>
</body>
</html>
I'm interested in the server-side coding of editing the HTML file, how do I load it, find the img tag and replace it with <svg> tag (for example) and save the html file with the same name and extension. I've tried a number of times but I seems to get confused with with all the different methods out there. This solution needs to be cross-browser compatible and don't use any dependency if possible, e.g. I tried using RecursiveTreeIterator once and my hosting company was blocking it from running.
Thanks
In general:
To load any file from local then process the content and save the result you need
1- load the file to server side
2- process the content
3- save the results in server side and give the client a link to download it
so you can create a new file (pars.php) and put this code in it, as you see it has comments to explain you each command
php code is just a simple example, you can improve it
<html>
<head>
</head>
<body>
<form class="public" action="<?php echo "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"; ?>" method="POST" enctype="multipart/form-data">
<p><label for="file">File Name:</label> <input type="file" name="file" id="file" /></p>
<br/>
<p><input type="submit" value="Parsing" name="sendData"/></p>
</form>
</body>
</html>
<?php
//test if the file is selected
if(!isset($_POST['sendData'])) exit;
//get file name
$filename = $_FILES["file"]["name"];
//be sure this file is html file
$ext = explode('.', $filename);
if($ext[1] != 'html'){
echo '<br>bad file type, it must be html file';
exit;
}
//upload the file to temp area
move_uploaded_file($_FILES["file"]["tmp_name"], $_FILES["file"]["name"]);
//read the file
$file = @fopen($filename, 'r');
if($file === false){
echo 'Error when reading the file';
exit;
}
//reading line by line
$output ='';
while (($line = fgets($file)) !== FALSE) {
$output .= str_replace('<img', '<svg', $line);
}
fclose($file);
//write the new file
$result = file_put_contents($filename, $output);
echo $result;
if(!$result){
echo 'faild';
}else{
echo 'success <br/>';
$load_link = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$load_link = str_replace('pars.php', '', $load_link);
$load_link .= $filename;
echo '<a href='.$load_link.'>See the results</a><br>';
}
?>
Why don't you just generate or tag by PHP? When I do it really silly and easy, it's going look like this:
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml" lang="he" xml:lang="he" dir="rtl">
<head>
<title>test</title>
<link rel="stylesheet" href="../Styles/cssreset-min.css" type="text/css"/>
<link rel="stylesheet" href="../Styles/page_styles.css" type="text/css"/>
<link rel="stylesheet" href="../Styles/style.css" type="text/css"/>
</head>
<body id="start">
<?php
if($something == "img") {
echo "<img src="../Images/cover.jpg" class="images" alt="Image 1"/>";
} else {
echo "<svg src="../Images/cover.jpg" class="images" alt="Image 1"/>";
}
?>
</body>
Are you looking for something like this ?
$html=file_get_contents($html_file);
$img_tag= strip_tags($html, '<img><img/>');
$svg_tag='<svg>...';
$html=str_replace($img_tag,$svg_tag,$html);
file_put_contents($html_file,$html);
See strip_tags