JavaScript基础：HTML页面调用calcSquare函数运行异常如何解决

• 错误1：误用.value属性获取非表单元素内容。value属性仅适用于input、select等表单交互元素，<p>是普通文本容器，需要用.innerText或.textContent读取其文本内容，且读取到的内容默认是字符串类型，需要转换为数值才能正确进行平方计算。
• 错误2：字符串拼接语法错误。console.log方法的参数中，"is"和计算结果number*number之间缺少+拼接运算符，会直接触发JS语法报错，同时原有字符串前后未加空格，也会导致输出文本连在一起不符合预期格式。

function calcSquare() {
    // 读取p标签文本并转换为数值类型
    var number = Number(document.getElementById("number").innerText);
    // 补全拼接运算符，调整空格保证输出格式正确
    console.log("The square of " + number + " is " + number * number);
}

如果追求更简洁的写法，也可以用ES6模板字符串实现拼接：

function calcSquare() {
    const number = Number(document.getElementById("number").innerText);
    console.log(`The square of ${number} is ${number * number}`);
}

内容的提问来源于stack exchange，提问作者KJM