js自定义一个函数,打印由<hr whidth='200'>构成的一个等腰倒三角,并在自定义按钮的单击事件中调用。(考虑无形参打印10行和有形参可打印任意行数两种情况)
时间: 2024-10-01 11:09:15 浏览: 43
在JavaScript中,你可以通过定义一个函数并结合HTML的DOM操作来完成这个需求。首先,我们需要创建一个HTML结构包含按钮以及一个区域来显示倒三角。然后,我们编写一个函数来打印倒三角,并给按钮添加点击事件处理函数,以便动态调整行数。
这是一个简单的例子:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>自定义倒三角</title>
</head>
<body>
<button onclick="printTriangle()">打印倒三角</button>
<div id="triangleArea"></div>
<script>
function printTriangle() {
var triangleArea = document.getElementById('triangleArea');
var numRows = prompt("请输入行数(默认10行):", "10");
if (!numRows) {
numRows = 10;
}
for (let i = 0; i <= numRows; i++) {
let row = '<hr width="200">';
for (let j = 0; j < numRows - i; j++) {
row += ' ';
}
for (let k = 0; k <= i; k++) {
row += '<hr width="200">';
}
triangleArea.innerHTML += row + '\n';
}
}
</script>
</body>
</html>
```
在这个示例中,用户可以点击“打印倒三角”按钮,会弹出提示框请求输入行数,如果不输入则默认为10行。函数会根据输入值生成相应的等腰倒三角。
阅读全文