Asking for advice on front-end data import problem_html/css_WEB-ITnose

I want to introduce a data file into the 25edfb22a4f469ecb59f1190150159c6 tag of HTML, so that I can directly change the data file in the future without having to change every piece of HTML. How can I achieve this?
This is my HTML part code

<td class="goods-type">                <label>货物类型：</label>                          <div class="ddl collapse">                            <input type="text" placeholder="货物类型" readonly>                            <ul>                              <li>option A</li>                              <li>option B</li>                            </ul>                          </div>                          <div class="ddl collapse">                            <input type="text" placeholder="包装方式" readonly>                            <ul>                              <li>option A</li>                              <li>option B</li>                            </ul>                          </div><span class="required">*</span>              </td>

This is the data file data.properties

################## 下拉框内容   ####################所有货源类型的字符串（全部，用逗号分隔，注意，顺序不可调换，只可在后面追加）all_goods_type=煤炭及制品,石油天然气,金属矿石,钢铁,矿建材料,水泥,木材,非金属矿石,化肥农药,盐,粮食,机械,设备电器,化工制品,有色制品,轻工,医药产品,农业产品#所有货源包装方式的字符串（全部，用逗号分隔，注意，顺序不可调换，只可在后面追加）all_goods_pack_method=纸箱,木箱,框架,桶装,编织袋,薄膜,框装,无包装

Reply to the discussion (solution)

Replace the content of option A with option B with the options of "coal and products, oil and gas, metal ores, steel, mining and construction materials, cement"

You see Let’s look at the template engine

The template engine I defined is parsed like this
html code

<p>{$data1}</p><p>{$data2}</p><p>{$data3}</p><p>{$data4}</p>

Parse this html in php, that is to say, encounter {$data1 } Just replace it with the data represented by data1. When you encounter {$data2}, replace it with the data represented by data2...

Take a look at the template engine

I define it myself. The template engine parses it like this:
html code

<p>{$data1}</p><p>{$data2}</p><p>{$data3}</p><p>{$data4}</p>

Parse this html in php. That is to say, if you encounter {$data1}, replace it with the data represented by data1. If you encounter {$ data2} Replace with the data represented by data2...

I use java as the backend, and both the front-end jsp and html have

The items of your data are variable , how can it be completely filled without traversing!

Solved, just write it into js and import it where needed, thank you everyone

{	var arr_str="煤炭及制品,石油天然气,金属矿石,钢铁,矿建材料,水泥,木材,非金属矿石,化肥农药,盐,粮食,机械,设备电器,化工制品,有色制品,轻工,医药产品,农业产品";	var arr = new Array();	arr = arr_str.split(",");	for (var i=0; i<arr.length; i++)        {            document.write("<li>" + arr[i]+"</li>");    } }