PHP：通过PHP或Javascript将数组值从文本转换为图标，并替换为HTML

我正在WordPress+WooCommerce的一个项目中工作，我在“商店”页面的产品标题下显示自定义WooCommerce属性

这些属性之一称为属性图标。与此属性相关的一些值是：icon_new和icon_vegan。其目的是将这些属性从原始的“icon_new”转换为HTML img标记问题：如何将这些文本片段转换为HTML img标记？我的第一次PHP和Javascript/jQuery替换失败

用于显示清洁图标属性值的功能代码：

function show_attr() {
    global $product;
    $attr_icons = array_values(wc_get_product_terms( $product_id, 'pa_icons'));
    echo implode(' ',$attr_icons);
}

此代码已保存在子主题的functions.php中

此代码的HTML结果：

<h2 class="woocommerce-loop-product__title">TITLE</h2>
icon_focus icon_new icon_sc icon_trvl icon_vegan icon_wf
<table class="shop_attributes">

---

通过（最好是）PHP或（或者）javascript（+jQuery）。

您就快到了。我建议在这里使用

foreach

，在这里，您可以查看从WordPress获得的每个结果，通过

stru replace（）

获得所需的名称片段，并将结果格式化为所需的

标记

我是这样做的：

---

这有帮助吗？

您可以构建一个翻译数组，然后使用该数组进行搜索和替换：

<img src="/icons/focus.png" alt="focus" class="focus">
<img src="/icons/new.png" alt="new" class="new">
<img src="/icons/sc.png" alt="sc" class="sc">
<img src="/icons/trvl.png" alt="trvl" class="trvl">
<img src="/icons/vegan.png" alt="vegan" class="vegan">
<img src="/icons/wf.png" alt="wf" class="wf">

$xlate=array（'icon\u new'=>”，
“icon_vegan”=>”；
//等
$attr_icons=数组_值（wc_get_product_术语（$product_id，'pa_icons'））；
$attr\u icons=str\u replace（数组键（$xlate），$xlate，$attr\u icons）；
回声内爆（“”，$attr_图标）；

---

我不知道WordPress，所以不知道为什么需要

数组\u值

…

用foreach循环替换内爆，该循环生成相关的HTMLTanks。那正是我要找的！

function show_attr() {
    global $product;

    // Your WP results
    //$attr_icons = array_values( wc_get_product_terms( $product_id, 'pa_icons' ) );

    // My test data
    $attr_icons = array('icon_focus','icon_new','icon_sc','icon_trvl','icon_vegan','icon_wf');

    foreach($attr_icons as $attr_icon){
        $filename = str_replace('icon_','',$attr_icon);
        echo '<img src="/icons/'.$filename.'.png" alt="'.$filename.'" class="'.$filename.'">';
    }
}

<img src="/icons/focus.png" alt="focus" class="focus">
<img src="/icons/new.png" alt="new" class="new">
<img src="/icons/sc.png" alt="sc" class="sc">
<img src="/icons/trvl.png" alt="trvl" class="trvl">
<img src="/icons/vegan.png" alt="vegan" class="vegan">
<img src="/icons/wf.png" alt="wf" class="wf">

$xlate = array('icon_new'   => '<img src="/icons/new.png" alt="New" class="new" />',
               'icon_vegan' => '<img src="/icons/vegan.png" alt="Vegan" class="vegan" />');
                //etc

$attr_icons = array_values(wc_get_product_terms($product_id, 'pa_icons'));
$attr_icons = str_replace(array_keys($xlate), $xlate, $attr_icons);
echo implode(' ', $attr_icons);