javascript输入一个数输出倒正等腰三角形
时间: 2024-09-19 19:02:54 浏览: 47
JavaScript中可以利用循环结构来创建数字表示的倒正等腰三角形。这里是一个简单的示例,假设用户输入了一个数字n:
```javascript
function drawTriangle(n) {
for (let i = 0; i < n; i++) {
let spaces = ' '.repeat(n - i - 1); // 空格的数量随着行数递减
let stars = '*'.repeat(2 * i + 1); // 星号的数量每行增加2
console.log(spaces + stars); // 输出每一行
}
for (let i = n - 2; i >= 0; i--) { // 上半部分倒序输出
let spaces = ' '.repeat(n - i - 1);
let stars = '*'.repeat(2 * i + 1);
console.log(spaces + stars);
}
}
// 示例:输入5
drawTriangle(5);
```
当你运行这个函数,并给`drawTriangle`传递一个整数如5,它会打印出一个5行的倒正等腰三角形:
```
*
***
*****
*******
* *****
***
*
```
相关问题
javascript输入一个数输出倒等腰三角形
在JavaScript中,你可以通过循环结构来创建一个输入数字n对应的倒等腰三角形。以下是一个简单的示例函数,它会根据用户输入打印出指定行数的倒等腰三角形:
```javascript
function printInvertedTriangle(n) {
for (let i = n; i > 0; i--) {
let spaces = " ".repeat(n - i); // 用于填充空格的部分
let stars = "*".repeat(2 * i - 1); // 用于打印星号的部分
console.log(spaces + stars); // 打印每一行
}
}
// 调用函数并传入想要的行数
printInvertedTriangle(prompt("请输入一个正整数:"));
```
这个函数首先从给定的数字n开始递减,然后计算每行所需的空格数和星号数。空格数等于总行数减去当前行数,星号数则是一倍的当前行数减一。每次循环都会将空格和星号连接起来,然后打印到控制台。
如果你想让用户直接在控制台运行这段代码,可以去掉`prompt()`部分,直接传递数字作为函数的参数,例如 `printInvertedTriangle(5)`。
在页面提示用户输入一个整数,当用 户输入的值大于5时,在页面输出一个倒三角形,例如输入6,在页面输出如图3所示的倒三角形,当输入值小于或等于5时,在页面上输出倒正三角形,例如输入4,在页面输出如图4所示的倒正三角形。
为了实现在页面上根据用户输入生成相应的图形,你可以使用HTML、CSS和JavaScript结合来实现这个交互功能。首先,创建一个简单的HTML表单让用户输入整数,然后利用JavaScript处理用户输入并根据条件绘制三角形。
1. HTML部分:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<title>三角形生成</title>
<style>
.triangle {
display: flex;
justify-content: center;
align-items: center;
}
</style>
</head>
<body>
<label for="number">请输入一个整数:</label>
<input type="number" id="number" oninput="drawTriangle(this.value)">
<div id="triangle"></div>
<script src="triangle.js"></script>
</body>
</html>
```
2. JavaScript部分 (triangle.js):
```javascript
function drawTriangle(n) {
const triangle = document.getElementById('triangle');
if (n <= 5) { // 输出正三角形
let str = '';
for (let i = 0; i <= n; i++) {
str += '*'.repeat(i * 2 + 1) + '\n';
}
triangle.textContent = str.trim();
} else { // 输出倒三角形
let str = '';
for (let i = n; i >= 1; i--) {
str += ' '.repeat(n - i) + '* '.repeat(2 * i - 1);
}
triangle.textContent = str.replace(/\n/g, '<br>');
}
}
```
在这个示例中,我们监听了`input`事件并在`drawTriangle`函数中根据输入的数字动态更新`<div>`元素的内容。如果用户输入的是5或更小的数,显示正三角形;如果大于5,则显示倒三角形。
阅读全文