Reputation: 5
This is my HTML code and I wanna replace <a>
tag with <img>
tag using DOMDocument
.
<a href='xxx.com'><img src='yyy.jpg'></a>
Here is the PHP
code:
$newNode=cj_DOMinnerHTML($link); //$link refer to anchor tag
$image_dom = new DOMDocument();
$image_dom->loadHTML($newNode);
$link->parentNode->replaceChild($image_dom, $link); //this replace making my parent node empty
cj_DOMinnerHTML
is function which return child nodes as HTML.
Upvotes: 0
Views: 2051
Reputation: 6548
Hello_ mate.
If I understood you well you want to remove the <a>
tags and I don't know what exactly your function cj_DOMinnerHTML
is doing, but I see that your are passing instance of DOMDocument
to replaceChild
method as first argument which is wrong. Refer to documentation to see how exactly is replaceChild
working (it accepts two arguments of type DOMNode
). Anyway I give you a code snippet that is replacing the <a>
tags. Please read the comments that I put in code and try to change the code for your use case.
$html = '
<div id="container">
<a href="xxx.com"><img src="yyy.jpg"></a>
<a href="aaa.com"><img src="aaa.jpg"></a>
<a href="bbb.com"><img src="bbb.jpg"></a>
<a href="ccc.com"><img src="ccc.jpg"></a>
<a href="ddd.com"><img src="ddd.jpg"></a>
<a href="eee.com"><img src="eee.jpg"></a>
</div>';
// load the dom document
$dom = new \DOMDocument();
if (!$dom->loadHTML($html)) {
echo '<h2>Error handle this ...</h2>';
}
// instantiate DOMXPath object
$finder = new \DOMXPath($dom);
// get all <a> tags of element that has id="container"
$anchors = $finder->query("//*[contains(concat(' ', normalize-space(@id), ' '), 'container')]/descendant::a");
// loop through all <a>
foreach ($anchors as $a) {
$parent = $a->parentNode;
// the following row of code will actually remove the <a> tag
$parent->replaceChild($a->childNodes->item(0), $a);
}
// show output
echo htmlspecialchars($dom->saveHTML());
OUTPUT
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<body>
<div id="container">
<img src="yyy.jpg">
<img src="aaa.jpg">
<img src="bbb.jpg">
<img src="ccc.jpg">
<img src="ddd.jpg">
<img src="eee.jpg">
</div>
</body>
</html>
I hope you will understand the code and you will be able to modify it to work for your needs.
Good luck friend!
Upvotes: 1