How to insert CSS formatting in Java Script

Asked

Viewed 6,479 times

2

I have the following Java Script code:

status.text('Enviando...');

How do I format this information that will be written on the screen with CSS?

Complete code:

<script type="text/javascript" src="js/jquery-1.6.1.min.js" ></script>
<script type="text/javascript" src="js/ajaxupload.3.5.js" ></script>
<link rel="stylesheet" type="text/css" href="./styles.css" />
<script type="text/javascript" >
    $(function(){
        var btnUpload=$('#upload');
        var status=$('#status');
        new AjaxUpload(btnUpload, {
            // Arquivo que fará o upload
            action: 'upload-file.php?cliente=<?php echo $cliente; ?>&cod=<?php echo $cod; ?>',
            //Nome da caixa de entrada do arquivo
            name: 'uploadfile',

            onSubmit: function(file, ext){
                 if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){ 
                    // verificar a extensão de arquivo válido
                    status.text('Somente JPG, PNG ou GIF são permitidas');
                    return false;
                }
                status.text('Enviando...');
                status.
            },
            onComplete: function(file, response){
                //Limpamos o status
                status.text('');
                //Adicionar arquivo carregado na lista
                if(response==="success"){
                    $('<li></li>').appendTo('#files').html('<strong>Foto inserida com sucesso!').addClass('success');
                } else{
                    $('<li></li>').appendTo('#files').html('<strong>Foto inserida com sucesso!').addClass('success');
                }
            }
        });

    });
</script>
javascript css

2 answers

1

Use the object attributes style of the element status.

For example, to change the color of the text to red in Vanillajs, use:

status.style.color = "#f00";

In the jQuery framework:

status.css("color", "#f00");
Show 2 more comments

1

You can also leave it preconfigured in your example style.css:

var status = $(".status");
status.text('Enviando...');
.status {
  color: #f00;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div class="status"></div>

See working on jsfiddle

Browser other questions tagged javascript css

You are not signed in. Login or sign up in order to post.