html - Change table td using javascript -


i new javascript take easy on me. want change data inside table using javascript. have looked everywhere suitable tutorial haven't found any. code.

function trans() {    var table = document.getelementbyid("table");    var row = table.getelementsbytagname("tr")[2];    var td = row.getelementsbytagname("td")[0];      td.innerhtml = "julius";  }
**css**  table {    width: 100%;    border-collapse: collapse;    font-family: calibri;  }  tr,  th,  td {    border: 2px solid black;    padding: 10px 10px 10px 10px;  }  thead {    background-color: black;    color: white;  }  tbody {    background-color: white;    color: black;  }  .center {    text-align: center;  }  .caption {    text-align: center;  }  button {    background-color: blue;    color: white;    border-radius: 5px;    height: 25px;  }
<html>    <body>    <table id="table" title="employment status verses living conditions">      <caption>employment status verses living conditions</caption>      <thead>        <tr>          <th colspan="3" class="caption">employment status verses living conditions</th>        </tr>        <tr>          <th>name</th>          <th>state</th>          <th>condition</th>        </tr>      </thead>      <tr>        <td>antony</td>        <td>employed</td>        <td>poor</td>      </tr>      <tr>        <td>grace</td>        <td>student</td>        <td>wealthy</td>      </tr>      <tr>        <td>jane</td>        <td>sponsored</td>        <td>self actualization</td>      </tr>      <tr>        <td>christine</td>        <td colspan="2" class="center"><i>unknown</i>        </td>      </tr>      <tr>        <td rowspan="2">james , john</td>        <td>fishermen</td>        <td>spiritual</td>      </tr>      <tr>        <td>brothers</td>        <td>disciples</td>      </tr>    </table>    <button onclick="trans()">change name</button>  </body>    </html>

when run code gives me following error, 

  {   "message": "uncaught typeerror: table.getelementbytagname not function",   "filename": "http://stacksnippets.net/js",   "lineno": 96,   "colno": 15 }

i have changed getelementbytagname getelementsbytagname still giving me error, wrong code , can fix it. find jsfiddle here

this works: code snippet
try this:

function trans() {   var table = document.getelementbyid("table");   var row = table.getelementsbytagname("tr")[2];   var td = row.getelementsbytagname("td")[0];    td.innerhtml = "julius"; }

you selected first tr has no td , th in , forgot "s" in "getelementsbytagname".

because "tag" can more 1 element need add "s" , when it's id makes sense 1 item therefor no "s" needed.


-

Comments

Post a Comment

Popular posts from this blog

unity3d - Rotate an object to face an opposite direction -

i have object , b. when click on object b, rotates object b (a faces b). b doesn't face a. need following : when faces b, need face opposite direction. have code rotating @ b. how rotate face opposite direction after that? vector3 targetdirection = target - transform.position; float step = speed * time.deltatime; vector3 newdirection = vector3.rotatetowards (turretdome.transform.forward, targetdirection, step, 0.0f); turretdome.transform.rotation = quaternion.lookrotation (newdirection); you object facing object b, want inverse direction of object after that? objecta.transform.rotation = quaternion.inverse(objecta.transform.rotation) but lets assume example turretdome object a, (negate direction): turretdome.transform.rotation = quaternion.lookrotation (-newdirection); naturally, both of these snippets not show how smoothen rotation, seem know how use time.deltatime. just incase unsure, quaternion.lerp this
Read more

angular - Is it possible to get native element for formControl? -

i've got angular2 reactive form . created formcontrol s , assigned input fields by [formcontrol]=... . understand creates nativeelement <-> formcontrol link. my question: possible nativeelement formcontrol ? wanna myformcontrol.nativeelement.focus() i can share 1 terrible solution works me. in reactive forms can use either 1) formcontroldirective ts mycontrol = new formcontrol('') template <input type="text" [formcontrol]="mycontrol"> or 2) formcontrolname ts myform: formgroup; constructor(private fb: formbuilder) {} ngoninit() { this.myform = this.fb.group({ foo: '' }); } template <form [formgroup]="myform"> <input type="text" formcontrolname="foo"> </form> so these directives write patch like 1) formcontroldirective const originformcontrolngonchanges = formcontroldirective.prototype.ngonchanges; formcontroldirective.proto
Read more

javascript - Why jQuery Select box change event is now working? -

i working on product filters user select select box according his/her preference not getting selected value user in jquery. html code:- <select name="product_filter" id="product_filter"> <option value="price_low_first">price : low high</option> <option value="price_high_first">price : high low</option> <option value="latest">latest</option> <option value="popular">most popular</option> </select> jquery code: $(function () { $("#product_filter").change(function () { alert("hi") var selectedtext = $(this).find("option:selected").text(); var selectedvalue = $(this).val(); alert("selected text: " + selectedtext + " value: " + selectedvalue); }); }); hi believe code perfect. once please check jquery.min.js
Read more