[javascript] How do I write a RGB color value in JavaScript?

I am trying to change the color of the function swapFE() below and I can't figure out how to write it. I was told to change the color of the phrase node to the color value (155, 102, 102). I tried to do that as you can see at the end of the function see- parent.childNodes[1].style.color= (155, 102, 102); but it just comes out a dark navy blue. It's supposed to be a brownish red. I have no idea what I'm doing wrong. How can I fix this to get the correct RGB color? I know I have the rest right it's just figuring out how to write the color and the value that's giving me problems. Thanks!

//this function changes the French phrase to an English phrase. 
    function swapFE(e) { 
           var phrase = e.srcElement;  
           //phrase.innerText = english[phrase.id]; 
           var parent = phrase.parentNode; 
           //childNodes[0] is the number of the phrase +1  
           var idnum = parent.childNodes[0]; 
           //parseInt takes a textstring and extracts it to make a number. Then you will subtract 1 from the number. 

       var phrasenum = parseInt(idnum.innerHTML)-1; 
       phrase.innerText = english[phrasenum]; 
       parent.childNodes[1].style.fontStyle= "normal"; 
       parent.childNodes[1].style.color= (155, 102, 102); 
  } 


function swapEF(e) { 
       var phrase = e.srcElement;  
       //phrase.innerText = english[phrase.id]; 
       var parent = phrase.parentNode; 
       var idnum = parent.childNodes[0]; 
       var phrasenum = parseInt(idnum.innerHTML)-1; 
       phrase.innerText = french[phrasenum]; 
       parent.childNodes[1].style.fontStyle= "italic"; 
       parent.childNodes[1].style.color= "black"; 

This question is related to javascript function coding-style colors rgb

The answer is


I am showing with an example of adding random color. You can write this way

var r = Math.floor(Math.random() * 255);
var g = Math.floor(Math.random() * 255);
var b = Math.floor(Math.random() * 255);
var col = "rgb(" + r + "," + g + "," + b + ")";
parent.childNodes[1].style.color = col;

The property is expected as a string


ES6 (template literal) helper functions:

function rgba(r, g, b, a=1){
    return `rgba(${r}, ${g}, ${b}, ${a})`
}
function rgb(r, g, b){
    return `rgb(${r}, ${g}, ${b})`
}

Here's a simple function that creates a CSS color string from RGB values ranging from 0 to 255:

function rgb(r, g, b){
  return "rgb("+r+","+g+","+b+")";
}

Alternatively (to create fewer string objects), you could use array join():

function rgb(r, g, b){
  return ["rgb(",r,",",g,",",b,")"].join("");
}

The above functions will only work properly if (r, g, and b) are integers between 0 and 255. If they are not integers, the color system will treat them as in the range from 0 to 1. To account for non-integer numbers, use the following:

function rgb(r, g, b){
  r = Math.floor(r);
  g = Math.floor(g);
  b = Math.floor(b);
  return ["rgb(",r,",",g,",",b,")"].join("");
}

You could also use ES6 language features:

const rgb = (r, g, b) => 
  `rgb(${Math.floor(r)},${Math.floor(g)},${Math.floor(b)})`;

dec2hex = function (d) {
  if (d > 15)
    { return d.toString(16) } else
    { return "0" + d.toString(16) }
}
rgb = function (r, g, b) { return "#" + dec2hex(r) + dec2hex(g) + dec2hex(b) };

and:

parent.childNodes[1].style.color = rgb(155, 102, 102);

this is better function

function RGB2HTML(red, green, blue)
{
    var decColor =0x1000000+ blue + 0x100 * green + 0x10000 *red ;
    return '#'+decColor.toString(16).substr(1);
}

Examples related to javascript

need to add a class to an element How to make a variable accessible outside a function? Hide Signs that Meteor.js was Used How to create a showdown.js markdown extension Please help me convert this script to a simple image slider Highlight Anchor Links when user manually scrolls? Summing radio input values How to execute an action before close metro app WinJS javascript, for loop defines a dynamic variable name Getting all files in directory with ajax

Examples related to function

$http.get(...).success is not a function Function to calculate R2 (R-squared) in R How to Call a Function inside a Render in React/Jsx How does Python return multiple values from a function? Default optional parameter in Swift function How to have multiple conditions for one if statement in python Uncaught TypeError: .indexOf is not a function Proper use of const for defining functions in JavaScript Run php function on button click includes() not working in all browsers

Examples related to coding-style

Method Call Chaining; returning a pointer vs a reference? 80-characters / right margin line in Sublime Text 3 Cannot find reference 'xxx' in __init__.py - Python / Pycharm How to stick <footer> element at the bottom of the page (HTML5 and CSS3)? Simple way to create matrix of random numbers Is calling destructor manually always a sign of bad design? Count all values in a matrix greater than a value Iterate through a C++ Vector using a 'for' loop Which comment style should I use in batch files? Dictionaries and default values

Examples related to colors

is it possible to add colors to python output? How do I use hexadecimal color strings in Flutter? How do I change the font color in an html table? How do I print colored output with Python 3? Change bar plot colour in geom_bar with ggplot2 in r How can I color a UIImage in Swift? How to change text color and console color in code::blocks? Android lollipop change navigation bar color How to change status bar color to match app in Lollipop? [Android] How to change color of the back arrow in the new material theme?

Examples related to rgb

What are the RGB codes for the Conditional Formatting 'Styles' in Excel? libpng warning: iCCP: known incorrect sRGB profile Get pixel's RGB using PIL How to compare two colors for similarity/difference Given an RGB value, how do I create a tint (or shade)? Why rgb and not cmy? RGB to hex and hex to RGB Convert System.Drawing.Color to RGB and Hex Value HSL to RGB color conversion How do I write a RGB color value in JavaScript?