document.getElementById("xx").style.xxx中的所有属性

本文详细对比了CSS和JavaScript中常用的样式属性,包括边框、背景、显示样式、字体及文本样式等,帮助开发者更好地理解和使用这些属性。
盒子标签和属性对照
CSS语法(不区分大小写) JavaScript语法(区分大小写)
border border
border-bottom borderBottom
border-bottom-color borderBottomColor
border-bottom-style borderBottomStyle
border-bottom-width borderBottomWidth
border-color borderColor
border-left borderLeft
border-left-color borderLeftColor
border-left-style borderLeftStyle
border-left-width borderLeftWidth
border-right borderRight
border-right-color borderRightColor
border-right-style borderRightStyle
border-right-width borderRightWidth
border-style borderStyle
border-top borderTop
border-top-color borderTopColor
border-top-style borderTopStyle
border-top-width borderTopWidth
border-width borderWidth
clear clear
float floatStyle
margin margin
margin-bottom marginBottom
margin-left marginLeft
margin-right marginRight
margin-top marginTop
padding padding
padding-bottom paddingBottom
padding-left paddingLeft
padding-right paddingRight
padding-top paddingTop
颜色和背景标签和属性对照
CSS 语法(不区分大小写) JavaScript 语法(区分大小写)
background background
background-attachment backgroundAttachment
background-color backgroundColor
background-image backgroundImage
background-position backgroundPosition
background-repeat backgroundRepeat
color color

样式标签和属性对照
CSS语法(不区分大小写) JavaScript 语法(区分大小写)
display display
list-style-type listStyleType
list-style-image listStyleImage
list-style-position listStylePosition
list-style listStyle
white-space whiteSpace

文字样式标签和属性对照
CSS 语法(不区分大小写) JavaScript 语法(区分大小写)
font font
font-family fontFamily
font-size fontSize
font-style fontStyle
font-variant fontVariant
font-weight fontWeight

文本标签和属性对照
CSS 语法(不区分大小写) JavaScript 语法(区分大小写)
letter-spacing letterSpacing
line-break lineBreak
line-height lineHeight
text-align textAlign
text-decoration textDecoration
text-indent textIndent
text-justify textJustify
text-transform textTransform
vertical-align

verticalAlign

function rmsSubmit() { var selectedType = $("#frmQuery select[name='scanIdType']").val(); //获取循环次数 var countId = document.getElementById("countId").value; var count = parseInt(countId); //判断次数 var isCount = parseInt(0); var strs1 = []; var strs2 = []; for (i = 1; i <= count; i++) { var scanId = ""; var rackId = ""; var searchResult = document.getElementById("searchResult"); var rows = searchResult.rows;//获取所有行 for (var i = 1; i < rows.length; i++) { var row = rows[i];//获取每一行 scanId = row.cells[1].id; rackId = row.cells[2].id; var scanIds = document.getElementById(rackId).innerHTML; var rackIds = document.getElementById(scanId).innerHTML; strs1 = strs1 + "," + scanIds; strs2 = strs2 + "," + rackIds; isCount++ } } if (count > 0) { if (isCount == count) { $.ajax({ type: "POST", url: "RmsAction?accessMethod=<%=AccessMethod.AJAX %>", data: { 'actionCode': '<%=ActionCode.CREATE_RMS_STORAGE_BINDING_DETAIL %>', 'scanIdType': selectedType, 'scanId': strs1, 'cabinetId': strs2, 'count': count }, dataType: "json", success: function (data) { if (data.return_code == "0") { alert(data.return_value); location.href = "tdRmsLotId.jsp?scanIdType=" + selectedType; } else { alert(data.return_value); } }, error: function () { alert("Ajax HTTP访问失败, 请联系IT处理!"); $('#butSend').attr("disabled", false); } }); } } else { alert("请输入数据后再提交!") } } 需要优化一下获取, 'scanIdType': selectedType, 'scanId': strs1, 'cabinetId': strs2, 'count': count function checkRms() { var scanIdObj = document.getElementById("scanId"); var rackIdObj = document.getElementById("rackId"); var scanIdType = $("select[name='scanIdType']").val(); var scanId = trim(scanIdObj.value.toUpperCase()); if (scanId.length == 0) return; // 获取配置 var rackIdKeyword = lotIdConfig.rackIdKeyword; var lengthRequirement = lotIdConfig.lengthRequirement; // 判断是否为 Rack ID if (scanId.indexOf(rackIdKeyword) >= 0) { if (scanId.length === lengthRequirement) { rackIdObj.value = scanId; scanIdObj.value = ''; scanIdObj.focus(); } else { alert("库位当前不满足" + lengthRequirement + "位字符!"); scanIdObj.value = ''; scanIdObj.focus(); return; } } else { // 格式校验逻辑 let isValid = true; if (scanIdType === "WAFERID") { // 格式要求:任意字符(至少一个) + "-" + 两位数字 const waferPattern = /^[A-Za-z0-9]+-\d{2}$/; if (!waferPattern.test(scanId)) { alert("Wafer ID 格式不正确,请输入类似 XXX-XX 的格式('-' 后必须为两位数字)"); isValid = false; } } if (!isValid) { scanIdObj.value = ''; scanIdObj.focus(); return; } document.getElementById("btn_submit").style.display = ""; scanIdObj.value = ''; scanIdObj.focus(); // 定义并获取 objTable var objTable = document.getElementById("searchResult"); if (!objTable) { alert("表格 searchResult 未找到,请检查页面结构!"); return; } $.ajax({ type: "POST", url: "RmsAction?accessMethod=<%=AccessMethod.AJAX %>", data: { 'actionCode': '<%=ActionCode.GET_MES_FW_LOT %>', 'scanId': scanId, 'type': scanIdType, }, dataType: "json", success: function (data) { if (data.return_code == "0") { if (data.return_value.length > 1) { alert("MES中获取到2个或以上的CTM与Product ID!"); } var countIdObj = document.getElementById("countId"); countIdObj.value = objTable.rows.length; q.innerHTML = q.innerHTML + '<tr id="button' + j + '"><td style="width: 20px;text-align: center;">' + '<button type="button" class="btn btn-primary" id=' + j + ' onclick="rmsRemove(this);" >Remove</button></td>' + '<td style="width: 40px;text-align: center;" id="rackId' + j + '" name="rackId" >' + rackId.value + '</td>' + '<td style="width: 40px;text-align: center;" id="scanId' + j + '" name="scanId" >' + scanId + '</td>' + '<td style="width: 40px;text-align: center;" id="rackId' + j + '" name="scanIdType" >' + scanIdType + '</td>' + '<td style="width: 40px;text-align: center;" id="rackId' + j + '" name="vendorId" >' + data.return_value[0].vendorId + '</td>' + '<td style="width: 40px;text-align: center;" id="scanId' + j + '" name="productId" >' + data.return_value[0].productName + '</td></tr>'; j++; } else { alert(data.return_value); } }, error: function () { alert("Ajax HTTP访问失败, 请联系IT处理!"); $('#butSend').attr("disabled", false); } }); } }这个方法生成的
最新发布
12-25
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值