用户要求编辑数量框,只能点击+-来设置数量,鼠标放到数量上,禁用用键盘输入。
JS代码:
//给CSS是.qty 添加一个属性onkeydown='return false',禁用数量input编辑 <script> const qty = document.getElementsByClassName('qty')[0]; qty.setAttribute('onkeydown', 'return false'); </script>
CSS代码
/*数量input*/ .woocommerce .quantity .qty{cursor: default;color: transparent;text-shadow: 0px 0px black;}
句法
setAttribute函数具有以下语法: Element.setAttribute(name, value) 此调用的参数是:
name –字符串– 要添加的属性的名称(即现有属性的名称)。
value –字符串– 属性的值(注意:每个属性都有一组必须遵守的有效值)。
一旦有了要使用的单个 HTML 元素,就可以使用以下函数来操作该元素的属性:
修改 属性,请使用setAttribute(name, value)
获取 属性的当前值,请使用getAttribute(name, value)
删除 属性,请调用removeAttribute(name, value)
其它用法
用setAttribute修改Input 的placeholder 值
Html
<input type="text" placeholder="Enter text">
JavaScript
const userInput = document.querySelector('input'); userInput.setAttribute('placeholder', 'Welcome!');
用setAttribute 修改 Image的src
Html
<img src="/imgs/add.png" id='img1'>
JavaScript
const img1 = document.getElementById('img1'); img1.setAttribute('src', '/imgs/2-arrows.png');