如何使用按钮在html中显示js对象？
如何使用按钮在html中显示js对象？
提问于 2021-01-21 16:10:13
我现在正试着用html显示我的对象和方法。我的目标是有2个按钮在html (信息vacc1，信息vacc2，打印我的对象的信息。我的目标是在我的按钮下面输出它
下面是我的js代码：
function myVaccines(companyName, vaccName, Type, numberOfShots, doesNotContain){
this.companyName = companyName;
this.vaccName = vaccName;
this.Type = Type;
this.numberOfShots = numberOfShots;
this.doesNotContain = doesNotContain;
}
var vacc1 = Vacc("Pfizer-BioNTech","BNT162b2","mRNA","2 shots, 21 days apart","Eggs, Preservatives, Latex");
var vacc2 = Vacc("Moderna","mRNA-1273","mRNA","2shots, 28 days apart","Eggs, Preservatives, Latex",)这里是我的html：(还不知道在这里放些什么)
<button onclick="myVaccines(vacc1)">
Information Vaccine 1
</button>
<p>Output1?</p>
<button onclick="myVaccines(vacc2)">
Information Vaccine 2
</button>
<p>Output2?</p>Stack Overflow用户
发布于 2021-01-21 16:35:59
您可以稍微修改一下代码，使var vacc1和var vacc2成为用作输入的数组，并在调用打印内容的函数时使用splat运算符
function myVaccines(companyName, vaccName, Type, numberOfShots, doesNotContain){
let args=arguments;
printout(event,...args)
}
const printout=function(e,args){
e.target.nextElementSibling.textContent=args.join(',')
}
var vacc1 = ["Pfizer-BioNTech","BNT162b2","mRNA","2 shots, 21 days apart","Eggs, Preservatives, Latex"];
var vacc2 = ["Moderna","mRNA-1273","mRNA","2shots, 28 days apart","Eggs, Preservatives, Latex"];<button onclick="myVaccines(vacc1)">Information Vaccine 1</button>
<p></p>
<button onclick="myVaccines(vacc2)">Information Vaccine 2</button>
<p></p>
一个稍有不同的版本，使用Object literal作为输入，因此每个打印项目都分配了一个键(可能是从原始代码中)
function myVaccines(companyName, vaccName, Type, numberOfShots, doesNotContain){
let args=arguments;
printout(event,...args)
}
const printout=function(e,args){
e.target.nextElementSibling.textContent=Object.keys(args).map(key=>{
return [key,args[key]].join(':')
}).join( ', ' )
}
var vacc1={
companyName:'Pfizer-BioNTech',
vaccName:'BNT162b2',
Type:'mRNA',
numberOfShots:'2 shots, 21 days apart',
doesNotContain:'Eggs, Preservatives, Latex'
}
var vacc2={
companyName:'Moderna',
vaccName:'mRNA-1273',
Type:'mRNA',
numberOfShots:'2shots, 28 days apart',
doesNotContain:'Eggs, Preservatives, Latex'
}<button onclick="myVaccines(vacc1)">Information Vaccine 1</button>
<p></p>
<button onclick="myVaccines(vacc2)">Information Vaccine 2</button>
<p></p>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65823324
复制相关文章
相似问题
腾讯云开发者
