js文件编写for循环嵌套

js文件实现图中效果,运用for循环写并且每个输出都有框框包裹

img

html代码如下,不知道这个框线是要用什么符号,大概逻辑看代码就懂了

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form>
    <input type="text" id="input" placeholder="输入直角三角形的层数"/>
    <button onclick="create()">生成</button>
</form>
<script>
    function create() {
        let num = document.getElementById("input").value;
        if (num === '') {
            alert('请输入内容');
            return false;
        }
        if (!(/(^[1-9]\d*$)/.test(num))) {
            alert('输入的不是正整数');
            return false;
        }

        for (let i = 1; i <= num; i++) {
            let char = '#';
            if (i % 2 === 0) {
                char = '* ';
            }

            for (let j = 0; j < i; j++) {
                document.write('一');
            }
            document.write('<br>')

            document.write('|');

            for (let j = 0; j < i; j++) {
                document.write(char + '|');
            }

            document.write('<br>')
        }

        for (let i = 0; i < num; i++) {
            document.write('一')
        }
        document.write('<br>')
    }

</script>
</body>
</html>

效果图

img


若对你有帮助,望采纳!