JS大神进！我想做一个JS，要添加一些物品，请问如何添加新物品的材质？在线等

这个添加新物品的材质图片，不是完全通过前端的js实现添加的，而是通过上传材质图片到后台，后台根据时间等特性给文件一个名称保存到服务器，并且将数据库里添加一条数据。然后js获取的是服务器端的数据中所对应的图片信息。然后得到图片信息后再用js的createElement创建DOM元素，生成一个新物品的材质。这个过程可以用跳转网页，也可以用ajax异步错做过程。

<script>

var goods = new Array(), // 保存商品的数组

counter = 0// 商品数目

function addList() {

var o = document.getElementById('add')

// 没有输入商品

if (o.value.length == 0) {

alert('please enter an item!')

return false

}

goods.push(o.value)// 添加商品到数组

counter++// 商品数目加一

show()

}

function resetList() {

counter = 0// resets the "counter" to zero

goods.length = 0// resets the array by reinitializing the array

show()

}

// 页面处理

function show() {

document.getElementById('add').setAttribute('value', '')// 清空输入

document.getElementById('number').setAttribute('value', counter)// 页面显示商品数目

document.getElementById('item').setAttribute('value', goods)// 页面显示商品

}

function remove() {

goods.pop()// removes the last item on your list

if (counter != 0) counter--// updates the counter

show()

}

function sortlist() {

goods.sort()// sorts the list alphabetically from A to Z

show()

}

function reverselist() {

goods.reverse()// sorts the list alphabetically from Z to A

show()

}

</script>

<h2>My Shopping List</h2>

<div>Enter an item to add in your list:

<input type="text" name="add" value=""/>

</div>

<div><input type="button" name="submit" value="Add to my List" onclick="addList()"/>

<input type="button" name="reset" value="reset" onclick="resetList()"/>

</div>

Number of items in your list:

<input type="text" name="number" value="0"/>

<div><b>Items you need to buy at the store:</b></div><br>

<input type="text" name="item" value="" style="width:450px"/>

<div>

<input type="button" name="remove" value="remove" onclick="remove()"/>

<input type="button" name="" value="sortlist" onclick="sortlist()"/>

<input type="button" name="reset" value="reverselist" onclick="reverselist()"/>

</div>

---