Question

我正在使用java脚本（或JQuery）在一些标签中创建标签。下面是我想要得到的最终输出，并将一些值和id附加到该格式。

<li class=" " >
  <label for="SearchFr-option-0" title="" class="ui-lert ui-state-hover">
   <input id="ui-multi-Filter-option-0" name="multiselect_measureFilter" type="checkbox"   
      value="100" title="Input Tags" checked="checked">
   <span>Input Tags</span>
  </label>
</li>

我怎样才能做到这一点。据我所知，我可以使用生成标签 var dateSpan = document.createElement（'span'）; var listTag = document.createElement（'li'）; 但无法实现整个html格式的li标签。您的建议更有价值。提前致谢。

Answer 1

您可以生成标记并附加到所需的UL ID。

＆＃13;

var html = '';
html += '<li class=" " >';
html += '<label for="SearchFr-option-0" title="" class="ui-lert ui-state-hover">';
html += '<input id="ui-multi-Filter-option-0" name="multiselect_measureFilter" type="checkbox"value = "100" title = "Input Tags" checked="checked">';
html += '<span>Input Tags</span>';
html += '</label> </li>';
$('#appendtoUl').append(html);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id='appendtoUl'>

</ul>

＆＃13;

Answer 2

我在这里使用jQuery来实现输出。您可以根据需要修改属性和文本。

HTML

<li class=" " >
  <label for="SearchFr-option-0" title="" class="ui-lert ui-state-hover">
   <input id="ui-multi-Filter-option-0" name="multiselect_measureFilter" type="checkbox"   
      value="100" title="Input Tags" checked="checked">
   <span>Input Tags</span>
  </label>
</li>

<li class='list2'>

</li>

JS

var label = $("<label>fsfsdfsdf</label");
var span = $("<span>Input Tags</span>");
var input = $('<input id="ui-multi-Filter-option-0" name="multiselect_measureFilter" type="checkbox" value="100" title="Input Tags" checked="checked">');
$(".list2").append(label.append(input).append(span));

https://jsfiddle.net/6hdew40d/

Answer 3

以下是您要找的内容：

＆＃13;

var myList = document.createElement("li");
myList.className = " ";
var myLabel = document.createElement("label");
myLabel.for = "SearchFr-option-0";
myLabel.title = "";
myLabel.className = "ui-lert ui-state-hover";
var myInput = document.createElement("input");
myInput.id = "ui-multi-Filter-option-0";
myInput.name = "multiselect_measureFilter";
myInput.type = "checkbox";
myInput.value = "100";
myInput.title = "Input Tags";
myInput.checked = "checked";
var mySpan = document.createElement("span");
var myTextNode = document.createTextNode("Input Tags");
mySpan.appendChild(myTextNode);
myList.appendChild(myLabel);
myList.appendChild(myInput);
myList.appendChild(mySpan);

＆＃13;

<li class=" " >
  <label for="SearchFr-option-0" title="" class="ui-lert ui-state-hover">
   <input id="ui-multi-Filter-option-0" name="multiselect_measureFilter" type="checkbox"   
      value="100" title="Input Tags" checked="checked">
   <span>Input Tags</span>
  </label>
</li>

＆＃13;

如何使用Java Script在in中附加Span with in li

3 个答案: