给2个单选按钮添加合适的事件句柄,选中某个选项会改变文字的粗体,要在js中用function实现
时间: 2023-06-16 19:05:07 浏览: 92
假设HTML代码为:
```html
<p id="text">这是一段文本</p>
<input type="radio" name="boldness" id="bold" value="bold"> 粗体
<input type="radio" name="boldness" id="normal" value="normal" checked> 普通
```
以下是JavaScript代码:
```javascript
// 获取文本元素
var text = document.getElementById("text");
// 获取两个单选按钮
var boldButton = document.getElementById("bold");
var normalButton = document.getElementById("normal");
// 为两个单选按钮添加事件句柄
boldButton.addEventListener("click", makeBold);
normalButton.addEventListener("click", makeNormal);
// 定义事件处理函数,使文本变为粗体
function makeBold() {
text.style.fontWeight = "bold";
}
// 定义事件处理函数,使文本变为普通
function makeNormal() {
text.style.fontWeight = "normal";
}
```
当用户选中“粗体”单选按钮时,文本将变为粗体;当用户选中“普通”单选按钮时,文本将变为普通。
阅读全文