时间戳

首页 > 解决方案 > 如何 console.log 多个对象？

javascript - 如何 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

在此处输入图像描述

标签： javascriptcssfunction

解决方案

经过几个小时的反复试验，我终于完成了我的壮举。“秘密”是在一个 console.log 中放置 2 种样式，代码可能看起来像是一个令人困惑的漂移，并且肯定会改进它。

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

最终结果----控制台输出 还是不知道怎么把图片直接插入帖子里抱歉:)

推荐阅读