এইচটিএমএল টেবিলের সমস্ত সারি মুছুন

104

<th>জাভাস্ক্রিপ্ট ব্যবহার না করে এবং টেবিলের সমস্ত সারিটি লুপ না করে কীভাবে আমি কোনও HTML টেবিলের সমস্ত সারি মুছব? আমার কাছে খুব বিশাল টেবিল রয়েছে এবং আমি মুছে ফেলার জন্য সারিগুলি লুপ করার সময় ইউআই হিমায়িত করতে চাই না

javascript html html-table

— কে ''
সূত্র

4

একটি লুপ থাকতে হবে, "মুছে ফেলার একাধিক-উপাদান" কমান্ড নেই, পদ্ধতিটিতে removeChildকেবল একটি একক ডিওএম উপাদান লাগে।

— Vidime Vidas

@ এসএলাক্স ধরেই নিচ্ছেন যে তিনি শিরোনামটির শিরোনামটি বোঝাচ্ছেন

— ইওনসদন

94

<th>সারিটি একটিতে <thead>এবং অন্য সারিতে রাখুন <tbody>তারপরে <tbody>একটি নতুন, খালি দিয়ে প্রতিস্থাপন করুন ।

অর্থাত্

var new_tbody = document.createElement('tbody');
populate_with_new_rows(new_tbody);
old_tbody.parentNode.replaceChild(new_tbody, old_tbody)

— কোয়ান্টিন
সূত্র

খুব সহজেই সর্বাধিক দক্ষ সমাধান, জাভাস্ক্রিপ্ট বিকাশকারীকে এইচটিএমএল সংশোধন করার অনুমতি দেওয়া হয়েছে provided

— ব্লেজমোনজার

4

সতর্কতা অবলম্বন করুন, আপনি যদি অভ্যন্তরীণ এইচটিএমএল বৈশিষ্ট্যটি ব্যবহার করে টডিটি প্রতিস্থাপন করতে চলেছেন তবে এটি আইটিতে কাজ করবে না, যদিও একটি কাজ আছে।

— আজিজ পুঞ্জানী

4

@ ইউনসদান - এটি কিছুটা বিষয়ভিত্তিক। এখানে প্রচুর গ্রন্থাগার রয়েছে (আমার ব্যক্তিগত অগ্রাধিকারটি হ'ল YUI 3 ব্যবহার করা হবে এই দিনগুলিতে) যদি এই সমস্যাযুক্ত কেউ তাদের মধ্যে একটির সাথে এই সমস্যাটি সমাধান করতে চান। তৃতীয় পক্ষের কোডটি আপনি যে পরিমাণে অন্তর্ভুক্ত করতে চান তা বিবেচনা না করেই নীতিগুলি একই হতে চলেছে।

— কোয়ান্টিন

4

এটিকে document.getElementById('tbody').innerHTML = '';

— ঘৃণ্য করা

4

@ ট্রি ট্রিটস ফোরস্ট এটি আমার পক্ষে ভাল কাজ করে। সম্ভবত ওপি-র সময় এটি সম্ভব ছিল না।

— মাবু

98

এটি সমস্ত সারি সরিয়ে ফেলবে:

$("#table_of_items tr").remove();

— অপারাও
সূত্র

45

আপনি যদি শিরোনামটি মুছতে না চান: $ ("# টেবিল_সামগ্রী tbody tr") remove সরান ();

— টিটিটি

4

খুব ভাল সরল উত্তর। আমি আমার কফিস্ক্রিপ্টটিতে ব্যবহার করেছি - আমি এক-লাইন সমাধানগুলি পছন্দ করি$("tbody#id tr").remove()

— n2o

আমি মনে করি এটি গৃহীত জবাবদিদের চেয়ে উত্তম উত্তর, যদিও এটি আপনি JQuery ব্যবহার করতে চান কিনা তার উপর নির্ভর করে। তবে কোনওভাবে .রেভ ক্রোমে কাজ করেনি।

— মিলিন্দ ঠাক্কর

টিটিটি, টেবিলের জন্য শিরোনাম তৈরি করতে <শিরোনাম <<<<<<<<<<<< ট্যাগগুলি ব্যবহার করুন। তারপরে $ ("# টেবিল_অফ_সামগ্রী tr") remove সরান (); আপনার পক্ষে ভাল কাজ করে, কারণ এটি কেবল <tr> ট্যাগগুলি সরিয়ে দেয়।

— কেট

টিটিটি, দয়া করে উত্তরে আপনার মন্তব্য যুক্ত করুন। আপনার উত্তর নিখুঁত!

— খোরশিদ

61

খুব অশোধিত, তবে এটি কাজ করে:

var Table = document.getElementById("mytable");
Table.innerHTML = "";

— মার্সেল
সূত্র

10

দুর্ভাগ্যক্রমে এটি ওপি যেমন জিজ্ঞাসা করে তেমনি শিরোনাম রাখে না keep

— জোসিট 4 ইভার

4

এটা আছে যদি তারা তাদের হেডার করা <th> একটি নেস্টেড <thead>। যাইহোক টেবিলটি তৈরির এটি সম্ভবত সবচেয়ে সিনট্যাক্টিক্যালি সঠিক উপায়।

— জন ব্ল্যাক

দুর্দান্ত কাজ করে। আমি মনে করি এটি কেবল আমার মতো লোকদের জন্য উপযুক্ত, যিনি টেবিল শিরোনাম, সারি, ঘর, জকিউয়েরিতে সমস্ত কিছু তৈরি করেছেন।

— শামসুল আরেফিন সজিব

এটি কেবলমাত্র একজন ব্যক্তির ভিতরে এইচটিএমএল সাফ করার জন্য ভাল কাজ করেছে :)

— রুডিঅনরেলস

আমি var bodyRef = document.getElementById('myTable').getElementsByTagName('tbody')[0]; bodyRef.innerHTML = '';

— এটির

22

সাধারণ ভুলগুলির জন্য নজর রাখার বিষয়গুলি :

যদি আপনার সূচনা সূচক 0 হয় (বা শুরু থেকে কিছু সূচক), তবে, সঠিক কোডটি হ'ল:

var tableHeaderRowCount = 1;
var table = document.getElementById('WRITE_YOUR_HTML_TABLE_NAME_HERE');
var rowCount = table.rows.length;
for (var i = tableHeaderRowCount; i < rowCount; i++) {
    table.deleteRow(tableHeaderRowCount);
}

মন্তব্য

১. মোছার জন্য আর্গুমেন্ট স্থির করা হয়েছে
এটি যেহেতু আমরা একটি সারি মুছব তাই সারি সংখ্যা হ্রাস পাবে required
অর্থাত্; আমি পৌঁছানোর সময় পর্যন্ত (rows.length - 1), বা এর আগেও এই সারিটি মোছার আগেই আপনার কিছু ত্রুটি / ব্যতিক্রম (বা একটি নীরব) থাকবে will

২. লুপটি শুরু হওয়ার আগেই রোউকাউন্টটি নেওয়া হয় যেহেতু আমরা "টেবিল.রোজ.লেনথ" মুছে ফেলতে থাকি তাই আবার আপনার কিছু সমস্যা রয়েছে যা কেবল বিজোড় বা এমনকি সারিগুলি কেবল মুছে ফেলা হবে।

আশা করি এইটি কাজ করবে.

— মনোহর রেড্ডি পোরেডি
সূত্র

17

এটি একটি পুরানো প্রশ্ন, তবে আমি সম্প্রতি একটি একই সমস্যা ছিল।
এটি সমাধানের জন্য আমি এই কোডটি লিখেছি:

var elmtTable = document.getElementById('TABLE_ID_HERE');
var tableRows = elmtTable.getElementsByTagName('tr');
var rowCount = tableRows.length;

for (var x=rowCount-1; x>0; x--) {
   elmtTable.removeChild(tableRows[x]);
}

এটি প্রথমটি বাদে সমস্ত সারি সরিয়ে ফেলবে।

চিয়ার্স!

— cstrat
সূত্র

10

সংক্ষিপ্ত (এবং দ্রুত): var সারসংক্ষেপ = myTable.rows.length; যখন (- সারি অ্যাকাউন্ট) myTable.deleteRow (সারি অ্যাকাউন্ট);

— পেটার

উপরের মন্তব্যে কোডটি প্রথম সারিটি সরিয়ে ফেলবে না

— প্রেফ্টটিবাইজসন

10

ধরে নিচ্ছি আপনার কাছে কেবল একটি টেবিল রয়েছে যাতে আপনি এটি কেবল প্রকারের সাথে উল্লেখ করতে পারেন। আপনি যদি শিরোনামগুলি মুছতে না চান:

$("tbody").children().remove()

অন্যথায়:

$("table").children().remove()

আশা করি এটা সাহায্য করবে!

— ফ্রান্সিসকো ল্যাপেজ-সানচো
সূত্র

8

আপনি যদি এর IDজন্য কোনও ঘোষণা tbodyকরতে পারেন তবে কেবল এই ফাংশনটি চালাতে পারেন:

var node = document.getElementById("tablebody");
while (node.hasChildNodes()) {
  node.removeChild(node.lastChild);
}

— ওএসবি
সূত্র

7

@ স্ট্র্যাট পোস্ট করা প্রথম এবং সমাধান ব্যতীত আমাকে সমস্ত সারি মুছতে হবে তবে তার ফলশ্রুতি ছাড়াই ব্যর্থ হয়েছে (নোডের রেফারেন্সিং যেখানে এটি বিদ্যমান নেই)। নিম্নলিখিত আমার জন্য কাজ করে।

var myTable = document.getElementById("myTable");
var rowCount = myTable.rows.length;
for (var x=rowCount-1; x>0; x--) {
   myTable.deleteRow(x);
}

— lkan
সূত্র

5

এটি স্থানীয় এইচটিএমএল টেবিলটিতে পুনরাবৃত্তি মুছে ফেলার কাজ করবে

document.querySelectorAll("table tbody tr").forEach(function(e){e.remove()})

— হান্টসম্যান
সূত্র

5

নীচে দেওয়া কোডটি দুর্দান্ত কাজ করে। এটি শিরোনাম সারি বাদে সমস্ত সারি সরিয়ে দেয়। সুতরাং এই কোড সত্যিই টি

$("#Your_Table tr>td").remove();

— sid
সূত্র

4

অপেক্ষা করুন, এটি jQuery উত্তর, মূল প্রশ্নটি বিশেষত jQuery সমাধানের জন্য জিজ্ঞাসা করল না!

— পুনর্বিবেচনা

3

আপনি যদি সরাতে না চান thএবং কেবল সারিগুলি সরাতে চান তবে এটি নিখুঁতভাবে কাজ করছে।

var tb = document.getElementById('tableId');
  while(tb.rows.length > 1) {
  tb.deleteRow(1);
}

— সুরেশ আত্তা
সূত্র

3

এটি সম্পর্কে:

পৃষ্ঠাটি প্রথম লোড হওয়ার পরে এটি করুন:

var myTable = document.getElementById("myTable");
myTable.oldHTML=myTable.innerHTML;

তারপরে আপনি যখন টেবিলটি সাফ করতে চান:

myTable.innerHTML=myTable.oldHTML;

ফলাফলটি আপনার শিরোনাম সারি (গুলি) হয়ে উঠবে যদি আপনি কেবল এটিই শুরু করেছিলেন, পারফরম্যান্সটি লুপিংয়ের চেয়ে নাটকীয়ভাবে দ্রুত।

— লেন হোয়াইট
সূত্র

খুব মার্জিত সমাধান

— পুনর্বিবেচনা করুন

3

টবি ট্যাগ কিছু আইডি Assing। অর্থাত্ এর পরে, নিম্নলিখিত লাইনে সারণী শিরোনাম / পাদচরণগুলি ধরে রাখতে হবে এবং সমস্ত সারি সরিয়ে ফেলা উচিত।

document.getElementById("yourID").innerHTML="";

এবং, আপনি যদি পুরো টেবিলটি (শিরোনাম / সারি / পাদলেখ) মুছে ফেলতে চান তবে টেবিল স্তরে আইডি সেট করুন অর্থাৎ

— বিনয়কুমার প্যাটেল
সূত্র

2

আপনার যদি <th>অ-সারিগুলির তুলনায় অনেক কম সারি থাকে <th>, আপনি সমস্ত <th>সারিগুলিকে স্ট্রিংয়ে সংগ্রহ করতে পারেন, পুরো টেবিলটি সরিয়ে ফেলতে পারেন এবং তারপরে <table>thstring</table>টেবিলটি কোথায় ছিল তা লিখতে পারেন।

সম্পাদনা: যেখানে, স্পষ্টতই, "থ্রাস্টিং" হ'ল সারিগুলির সমস্তগুলির জন্য এইচটিএমএল <th>।

— yoozer8
সূত্র

4

বরং, <th>ডিওএম উপাদান হিসাবে গুলি সংগ্রহ করুন , টেবিলের অন্তর্নিহিত এইচটিএমএল সাফ করুন, তারপরে <th>আবার এটি যুক্ত করুন ।

— এনটোনিও

সতর্কতা অবলম্বন করুন, আপনি যদি অভ্যন্তরীণ এইচটিএমএল বৈশিষ্ট্যটি ব্যবহার করে পরিষ্কার টোডি প্রতিস্থাপন করতে চলেছেন তবে এটি আইই তে কাজ করবে না, যদিও সেখানে কাজ করা যায় না।

— আজিজ পুঞ্জানী 14

2

এটি টেবিলের জন্য কোনও বৈচিত্র্য প্রকাশ না করেই IE এ কাজ করে এবং সমস্ত সারি মুছে ফেলবে:

for(var i = 0; i < resultsTable.rows.length;)
{   
   resultsTable.deleteRow(i);
}

— লেস্টার নর্থ
সূত্র

2

আপনার টিডির জন্য একটি আইডি বা একটি ক্লাস অর্পণ করুন।

document.querySelector("#tbodyId").remove();
document.querySelectorAll(".tbodyClass").remove();

আপনি নিজের আইডি বা শ্রেণীর নাম কীভাবে চান তা নামক করতে পারেন, অগত্যা #tbodyIdবা নয় .tbodyClass।

— আন্দ্রেয়া
সূত্র

1

এটি একটি সরল কোড যা আমি সবেমাত্র শিরোনাম সারিটি (প্রথমটি) অপসারণ না করে এটি সমাধান করার জন্য লিখেছি।

var Tbl = document.getElementById('tblId');
while(Tbl.childNodes.length>2){Tbl.removeChild(Tbl.lastChild);}

আশা করি এটা তোমার জন্য কাজ করবে!!.

— ব্যবহারকারী 3423649
সূত্র

0

শুধু টেবিলের বডি সাফ করুন।

$("#tblbody").html("");

— শিব
সূত্র

4

এইচটিএমএল () আসলে একটি jQuery পদ্ধতি।

— ক্যারলডারসো

-1

কনস্ট টেবিল = ডকুমেন্ট.কোয়ারী নির্বাচনকারী ('টেবিল'); table.innerHTML === ''? নাল: টেবিল.इनার এইচটিএমএল = ''; উপরের জাভাস্ক্রিপ্ট আমার জন্য ভাল কাজ করেছে। এটি টেবিলে কোনও ডেটা রয়েছে কিনা তা যাচাই করে এবং তারপরে শিরোনাম সহ সমস্ত কিছু সাফ করে।

— পোপ ফ্রান্সিস
সূত্র