已知有姓和名两个数据,通过计算属性的方式将完整的姓名显示到div框中
时间: 2024-09-07 19:01:41 浏览: 28
如果你想在前端HTML和JavaScript中,利用已知的姓氏和名字作为属性值动态显示在`<div>`元素中,你可以这样做:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>姓名显示示例</title>
</head>
<body>
<div id="nameDisplay"></div>
<!-- JavaScript部分 -->
<script>
// 假设我们有姓和名的变量
let lastName = "张";
let firstName = "三丰";
// 创建完整姓名字符串,并将其赋值给div的innerText
var divElement = document.getElementById("nameDisplay");
divElement.innerText = lastName + " " + firstName;
// 或者,如果你想要更模块化,可以封装成函数
function displayFullName(last, first) {
var divElement = document.getElementById("nameDisplay");
divElement.innerText = last + " " + first;
}
// 调用函数展示全名
displayFullName("张", "三丰");
</script>
</body>
</html>
```
在这个例子中,当页面加载时,"张三丰" 就会被显示在id为 "nameDisplay" 的`<div>`元素里。你可以根据实际需要修改 `lastName` 和 `firstName` 变量。