bootstrap5-tags/demo-many.html

Replace select[multiple] with nices badges for Bootstrap 5

<script src="https://code.jquery.com/jquery-3.7.1.slim.min.js" integrity="sha256-kmHvs0B+OpCW5GVHUNjv9rOmY0IvSIRcf7zGUDTDQM8=" crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/js/bootstrap.bundle.min.js" type="module"></script>

<div id="selects"></div>

<script type="module">
  import Tags from "./tags.js";

 $("#selects").html(
    Array(300)
      .keys()
      .toArray()
      .map((_) => `<select multiple></select>`)
  );

  console.time("Tags");
  Tags.init("select", {
    placeholder: 'Type something wwwwwwwwwwwwwwwwwwwwww...',
    allowClear: true,
    allowNew: true,
  });
  console.timeEnd("Tags");
</script>