تشترك هذه المقالة في طريقة بسيطة لتشغيل جداول JS للرجوع إليها. المحتوى المحدد كما يلي
<! doctype html> <html> <head> <meta charset = "utf-8" /> <title> zzzz </itlem> <style> *{margin: 0 ؛ الحشو: 0 ؛ } body {width: 1000px ؛ الهامش: 100px Auto ؛ Font-Family: "Microsoft Yahei" ؛ حجم الخط: 18 بكسل ؛ خلفية اللون: #fff ؛ } #table tr {text-align: center ؛ } tbody tr: nth-child (2n+1) {background-color: #ccc ؛ } tbody tr: hover {background-color: green ؛ } الإدخال [type = text] {height: 25px ؛ العرض: 136 بكسل ؛ خلفية اللون: الفيروز. هامش القاع: 10 بكسل ؛ } </style> <script type = "text/javaScript"> window.onload = function () {var otb = document.getElementById ("table") ؛ var otr = otb.tbodies [0] .Rows ؛ var oadd = document.getElementById ("add") ؛ var oneme = document.getElementById ('name') ؛ var osex = document.getElementById ('sex') ؛ var id = otr.length+1 ؛ oadd.onclick = function () {var attr = document.createElement ('tr') ؛ var atd1 = document.createElement ('td') ؛ var atd2 = document.createElement ('td') ؛ var atd3 = document.createElement ("td") ؛ var atd4 = document.createElement ("td") ؛ atd4.innerhtml = '<a> delete </a>' ؛ atd1.innerhtml = id ++ ؛ atd2.innerhtml = oname.value ؛ atd3.innerhtml = osex.value ؛ ATR.AppendChild (ATD1) ؛ ATR.AppendChild (ATD2) ؛ ATR.AppendChild (ATD3) ؛ ATR.AppendChild (ATD4) OTB.TBodies [0] .AppendChild (ATR) ؛ atd4.getElementsByTagName ('a') [0] .onclick = function () {otb.tbodies [0] .removechild (this.parentNode.ParentNode)}} var obtn = document.getElementById ("btn") ؛ var otxt = document.getElementById ("ss") ؛ obtn.onclick = function () {for (var i = 0 ؛ i <otb.tbodies [0] .rows.length ؛ i ++) {var osta = otb.tbodies [0] .Rows [i] .cells [1] .innerhtml.toLowercase () ؛ var ot = otxt.value.toLowerCase () ؛ var oar = ot.split ('') ؛ otb.tbodies [0] .Rows [i] .style.background = '' ؛ لـ (var j = 0 ؛ j <oar.length ؛ j ++) {if (osta.search (oar [j])! =-1) {otb.tbodies [0] .Rows [i] .style.background = 'red' ؛ }}}}} ad) type = "button" value = "add" id = "add"/> <table id = "ttrun> <td> الرقم التسلسلي </td> <td> اسم الأشخاص </td> <td> <td> male </td> <td> delete </td> </tr> <tr> <td> 2 </td> <td> li si </td> <td> mal <td> female </td> <td> حذف </td> </td> <td> 4 </td> <td> liu yan </td> <td> female </td> <td> delete </td> </tbody> </tbody> </tide> </body> </html>ما سبق هو كل شيء عن هذا المقال ، آمل أن يكون مفيدًا لتعلم الجميع.