如何console.log多个对象?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何console.log多个对象?相关的知识,希望对你有一定的参考价值。
我正在创建一个javascript练习,我的想法是创建一个可以给我图标返回的函数,为此我正在使用FontAwesome。我设法使其显示图标和消息,但是我想通过函数添加预定义的标题,重点..等样式,但是我仍然想不出一种形式。我什至尝试使用Swith,但它仅将CSS复制为任何字符串
function icones(ico_name, text,style ){ // Capture icon name, style to be used and text
switch(ico_name) { //Check argument icon
case 'user':
ico_name = '%c ' //Icon will only be displayed after CSS declaration
font = 'font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 20px; content: "f434";'
break
}
switch(style) { // Styling text
case 'title':
text = 'color: red'
break
}
console.log(ico_name,font,text)
}
icones('user','player', 'title') //Applying values to function
答案
我不确定这是否是您要寻找的,但是您可以使用document.getElementById()
在网页中获取元素,然后应用CSS样式。
例如,如果您要更改其字体的元素的id
属性设置为"changeMyFont"
:
<span id="changeMyFont"></span>
您可以使用JavaScript这样更改其CSS属性:
var elem = document.getElementById("changeMyFont");
elem.style.fontFamily = "Font Awesome 5 Free";
elem.style.fontWeight = 900;
elem.style.fontSize = "20px";
要将特定元素的文本颜色更改为红色,可以按照相同的步骤进行。要更改html标记中的内容,请使用innerHTML
(此处不允许用户输入;这是XSS威胁):
document.getElementById("elementToChange").innerHTML = "HTML here";
您可以在其中使用HTML转义符。
另一答案
在反复试验几个小时之后,我得以完成我的壮举。“秘密”是将两种样式仅放在一个console.log中,该代码看起来似乎是一个令人困惑的漂移,并且肯定会加以改进。
function icones(ico_nome,texto,style ){ // Captura o nome do icone, o estilo que sera utilizado e o texto
switch(ico_nome) { // Check argument icon
case 'user':
ico_nome = '%c ' // Icon will only be displayed after CSS declaration
font_icon = 'font-family:"Font Awesome 5 Free"; font-weight: 900; font-size: 20px;' //Declara a fonte para visualização
break
}
switch(style) { // Styling text
case 'titulo': // Set styles for titles
font_icon += 'color:red;' //Set the color Red to Icon
style_text = 'color:blue; font-family: Arial;' // Set styles for texts
break
default:
font_icon += 'color: black' // Set default color
}
console.log(ico_nome + ' ' + '%c' + texto,font_icon,style_text) //Join the 2 styles and reveal the output
}
icones('user','Usuario', 'titulo') //Applying values to function
另一答案
使用Jquery函数.css()
例如:
$("#element").css("font-size", "20pt")
以上是关于如何console.log多个对象?的主要内容,如果未能解决你的问题,请参考以下文章