html - Javascript to change the text color -

-

i have html table displays value below:

<table id="tableid"> <thead> <tr>   <th>column heading 1</th>   <th>column heading 2</th>   <th>column heading 3</th>   <th>column heading 4</th> </tr> </thead> <tbody> <tr>  <td> id (43.1)</td>   <td>class (-23)</td>   <td>age (89.6)</td>   <td>num (-5)</td> </tr> <tr>   <td>id (-4)</td>   <td>class (-3)</td>   <td>age (0)</td>   <td>num (98)</td> </tr> <tr>   <td>id (10)</td>   <td>class (-32)</td>   <td>age (7)</td>   <td>num (2)</td> </tr>

task @ hand change text color on condition basis. if value negative, should displayed in red, else green. have no idea how change this, till i'm able create below javascript code, not sure how handle text color , event should use. can please provide directions.

var table = document.getelementbyid('tableid'), cells = table.getelementsbytagname('td');  (var i=0,len=cells.length; i<len; i++){ cells[i].onready = function(){ // onready .. work??     console.log(this.innerhtml);  } }

edit: how i'm generating html table

function generatetable($associative_array){ echo '<table width="620" id ="optimization" class="optimization_table"><thead><tr><th>'; echo implode('</th><th>', array_keys(current($associative_array))); echo '</th></tr></thead><tbody>'; foreach ($associative_array $row){     array_map('htmlentities', $row);     echo '<tr valign="middle"><td>';     echo implode('</td><td>', $row);      echo '</td></tr>'; } echo '</tbody></table>'; }

help appreciated.

get cells, iterate on them, numbers, compare agains 0 see if negative/positive, set color, done ...

var cells = document.queryselectorall('#tableid td');  ( var i=0; i<cells.length; i++ ) {     var cell    = cells[i];     var html    = cell.innerhtml;     var changed = html.replace(/([+-]?(\d|\.)+)/, function(x) {         var color = (+x) < 0 ? 'red' : 'green';         return '<span style="color: ' + color + '">' + x + '</span>';     });      cell.innerhtml = changed; }

fiddle


Comments

Post a Comment

Popular posts from this blog

multithreading - Exception in Application constructor -

-
i wanna write snake game javafx , there exception don't know , want know how fix it. ( know it's not complete yet ) and want know , class extends application ( start override ) main in other programs? see , here not static void main bc didn't need, if want add main shoud do? it's exeption... exception in application constructor exception in thread "main" java.lang.nosuchmethodexception: main_snake.main([ljava.lang.string;) @ java.lang.class.getmethod(class.java:1819) @ com.intellij.rt.execution.application.appmain.main(appmain.java:125) and code : import javafx.animation.animationtimer; import javafx.application.application; import javafx.event.eventhandler; import javafx.scene.scene; import javafx.scene.canvas.canvas; import javafx.scene.canvas.graphicscontext; import javafx.scene.input.keyevent; import javafx.scene.layout.borderpane; import javafx.scene.paint.color; import javafx.stage.stage; import java.util.arraylist; /** * creat...
Read more

React Native allow user to reorder elements in a scrollview list -

-
i'm trying let user reorder elements in scrollview list long-pressing on 1 of elements. we're trying let user use long press pick element of scrollview list, , put element somewhere else in list. have working using animated view, issue it's difficult integrate scrolling , swipe-to-delete animated view. we're hoping add "pick , reorder" scrollview. is there preferred method accomplishing this? touchablewithoutfeedback has onlongpress method, can implement this: _onlongpress() { // perform sort }, <touchablewithoutfeedback onlongpress={ () => this._onlongpress() }> <text>click , hold call onlongpress</text> </touchablewithoutfeedback> as far sorting, can use type of library such lodash or underscore, plus there ways sort using vanilla javascript. check out this thread. i've set basic project using sort function on listview here . https://rnplay.org/apps/mpbktg 'use strict'; var react = requ...
Read more

windows - CertCreateCertificateContext returns CRYPT_E_ASN1_BADTAG / 8009310b -

-
i realize similar post others (e.g. this one ), there details missing posts might significant case. to start with, here's simplified program: #include "stdafx.h" #include <windows.h> #include <wincrypt.h> int _tmain(int argc, _tchar* argv[]) { // usage: certextract certpath char keyfile[] = "c:\\certificates\\public.crt"; byte lp[65536]; security_attributes sa; handle hkeyfile; dword bytes; pccert_context certcontext; sa.nlength = sizeof(sa); sa.lpsecuritydescriptor = null; sa.binherithandle = false; hkeyfile = createfile(keyfile, generic_read, file_share_read, &sa, open_existing, file_attribute_normal, null); if (hkeyfile) { if (readfile(hkeyfile, lp, getfilesize(hkeyfile, null), &bytes, null) && bytes > 0) { certcontext = certcreatecertificatecontext(x509_asn_encoding, lp, bytes); if (certcontext) { printf("yay...
Read more