如何在文本区域中放置标签，并让用户在标签之后输入

<label for="inputField">标签名称：</label>
<input type="text" id="inputField" name="inputField">

<table>
  <tr>
    <td>标签名称：</td>
    <td><input type="text" name="inputField"></td>
  </tr>
</table>

<div style="display: flex;">
  <span style="margin-right: 10px;">标签名称：</span>
  <input type="text" name="inputField">
</div>

<div id="labelContainer"></div>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  $(document).ready(function() {
    var label = $('<label>').text('标签名称：');
    var input = $('<input>').attr('type', 'text').attr('name', 'inputField');
    $('#labelContainer').append(label).append(input);
  });
</script>