中国传统的十二章纹作为衮服、朝服的纹饰。这是儒家的规制，历代皇帝的冕服，从舜帝时代就用这十二章纹为饰了，以后历代都奉承古法，经数千年而不变 (十二章纹即日、月、星、山、龙、华虫、宗彝、藻、水、粉米、黼、黻。这十二章纹的意义是：日、月、星象征光照大地，山兴云雨，龙能灵变，华虫象征华栅多彩，宗彝表示不忘祖先，藻表不文采，火象征兴旺，粉米能够养人，黼象征权力，黻表示君臣离合及善恶相背 )。这十二纹章是皇帝最高权力的象征，除皇帝之外，其他人不能穿用。
官服补子，又称"背胸"、"胸背"。其十二章纹一般都用彩线绣制，亦称 "绣补" ，也有织造的。明代补子的尺寸大者达40厘米(清代补子一般在30厘米左右)。
http://www.zh5000.com/JS/buzhi/bz-online-0001.htm
http://www.zh5000.com/JS/buzhi/bz-online-0004.htm
位运算 OR 由符号（|）表示，是直接对数字的二进制形式进行运算。8的二进制形式是10001的二进制形式是0001然后每个数字中的数位对齐进行比较,两两比较，只有有其中一个是1（true），比较的结果就是1（true）1000和0001第1位1|0 ->1第2位0|0 ->0第3位0|0 ->0第4位0|1 ->1最后得到的是1001，转为十进制是9不知道说明白没，你可以再去看看这个（关于位运算的） http://www.w3school.com.cn/js/pro_js_operators_bitwise.asp完整代码：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
type="text/javascript"
></script>
<style>
button {
width: 60px
}
</style>
</head>
<body>
<h6>
总价：¥<span class="total"></span>      
折后总价：¥<span class="total-after"></span>
</h6>
<table border="1" cellpadding="10">
<tr>
<th>序号</th>
<th>分类名称</th>
<th>商品编码</th>
<th>商品名称</th>
<th>库存</th>
<th>单位</th>
<th>价格</th>
<th>
活动价格
<select onchange="changePrice(this.value)">
<option value="0.1">一折</option>
<option value="0.2">二折</option>
<option value="0.3">三折</option>
<option value="0.4">四折</option>
<option value="0.5">五折</option>
<option value="0.6">六折</option>
<option value="0.7">七折</option>
<option value="0.8">八折</option>
<option value="0.9">九折</option>
<option value="1" selected>无折扣</option>
</select>
</th>
<th>
操作
</th>
</tr>
</table>
<script type="text/javascript">
var initDatas = [
{
order: 304,
category: "护肤",
productCode: "SC20200001",
productName: "3525",
store: 111,
unit: 1,
price: 2,
price2: 2,
},
{
order: 136,
category: "防晒",
productCode: "SC8888",
productName: "防晒霜",
store: 100,
unit: 1,
price: 10,
price2: 10,
},
]
$(function () {
loadTableData(initDatas)
})
function loadTableData(dataList) {
var total = 0
var totalAfter = 0
$('.data-row').remove()
dataList.map(function (data, index) {
var row = $(
"<tr class='data-row'>" +
" <td align='center'>" + data.order + "</td>" +
" <td align='center'>" + data.category + "</td>" +
" <td align='center'>" + data.productCode + "</td>" +
" <td align='center'>" + data.productName + "</td>" +
" <td align='center'>" + data.store + "</td>" +
" <td align='center'>" + data.unit + "</td>" +
" <td align='center'>" + data.price + "</td>" +
" <td align='center'>" + data.price2 + "</td>" +
" <td align='center'><button onclick='deleteRow(" + index + ")'>删除</button></td>" +
"</tr>"
)
$("table").append(row)
total += data.price * data.store
totalAfter += data.price2 * data.store
})
var row = $(
"<tr class='add-row data-row'>" +
" <td align='center'><input type='text' style='width:50%'/></td>" +
" <td align='center'><input type='text' style='width:50%'/></td>" +
" <td align='center'><input type='text' style='width:50%'/></td>" +
" <td align='center'><input type='text' style='width:50%'/></td>" +
" <td align='center'><input type='number' style='width:50%'/></td>" +
" <td align='center'><input type='number' style='width:50%'/></td>" +
" <td align='center'><input type='number' style='width:50%'/></td>" +
" <td align='center'><i class='error' style='color:red'></i></td>" +
" <td align='center'><button onclick='addRow()'>新增</button></td>" +
"</tr>"
)
$("table").append(row)
$('.total').text(total.toFixed(2))
$('.total-after').text(totalAfter.toFixed(2))
}
/**
* 删除行
*/
function deleteRow(index) {
initDatas.splice(index, 1)
loadTableData(initDatas)
}
/**
* 新增行
*/
function addRow() {
var order = $(".add-row input").eq(0).val()
var category = $(".add-row input").eq(1).val()
var productCode = $(".add-row input").eq(2).val()
var productName = $(".add-row input").eq(3).val()
var store = $(".add-row input").eq(4).val()
var unit = $(".add-row input").eq(5).val()
var price = $(".add-row input").eq(6).val()
var price2 = price && price * $("select").val()
if (!order || !category || !productCode || !productName || !store || !unit || !price || !price2) {
$('.error').text('请输入完整信息!')
return
}
initDatas.push({
order: order,
category: category,
productCode: productCode,
productName: productName,
store: store,
unit: unit,
price: price,
price2: price2
})
loadTableData(initDatas)
}
/**
* 修改折扣
*/
function changePrice(act) {
initDatas.map(function(data) {
data.price2 = data.price * act
})
loadTableData(initDatas)
}
</script>
</body>
</html>
