Question

我div data-attr data-attr。我想使用jQuery列出li中的所有html值。请帮我。下面是我的<div data-attr="one">Contents goes here</div> <div data-attr="two">--</div> <div data-attr="three">----</div>，我的期望值低于它。

<ul>
  <li>one</li>
  <li>two</li>
  <li>three</li>
</ul>

我的期望

Regex regex = new Regex("^(?=.+[A-Za-z])(?=.+\\d)(?=.+[$@$!%*#?&])[A-Za-z\\d$@$!%*#?&]{8,}$");
if (regex.IsMatch(txtPassword.ToString()))
{
    MessageBox.Show("Data Saved Correctly");   
}
else
{
    txtPassword.Clear();
    MessageBox.Show("Password should contain atleast one alphabet,number & special character");
}

Answer 1

使用div[data-attr]遍历所有each()并在data-attr中追加每个div的{{1}}。

＆＃13;

ul

＆＃13;

$("div[data-attr]").each(function () {
    $('ul').append('<li>'+$(this).data('attr')+'</li>');
});

＆＃13;

Answer 2

你可以这样做，

＆＃13;

$('div').each(function(){
	var data = $(this).data('attr');
  $('ul').append('<li>'+data+'</li>');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div data-attr="one">Contents goes here</div>
<div data-attr="two">--</div>
<div data-attr="three">----</div>
<ul>
</ul>

＆＃13;

Answer 3

使用其属性值作为文本迭代具有data-attr并生成li的元素

// generate ul element
$('<ul>', {
  // set html content by iterating over content div
  html: $('[data-attr]').map(function() {
      // generating `li` with div content as text
      return $('<li>', {
         text: $(this).data('attr')
      })
    // getting array of li
    }).get()
// appending beginning of the body
}).prependTo('body')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div data-attr="one">Contents goes here</div>
<div data-attr="two">--</div>
<div data-attr="three">----</div>

仅供参考：如果您要删除div，请使用$('[data-attr]').remove()

Answer 4

您需要使用jquery＆＃39; s div遍历每个.each()并创建一个li项data-attr并将其附加到新创建的无序列表

JS CODE：

 var list = $('<ul></ul>');
 $('.parent div').each(function() {
   $('<li></li>').text($(this).data('attr')).appendTo(list);
 });
 $('.parent').append(list);

Live Demo @ JSFiddle

Answer 5

<div data-attr="one">Contents goes here</div>
<div data-attr="two">--</div>
<div data-attr="three">----</div>
<ul></ul>

$( document ).ready(function() {
   $("div[data-attr]").each(function () {
   $('ul').append('<li>'+$(this).data('attr')+'</li>');
  });
});

你可以使用JQ追加

Answer 6

这是你需要做的，

使用JQuery过滤器选择具有data-attr属性的div元素。

var elements=$("div[data-attr]");
遍历每个元素（使用JQuery each（）方法）并获取data-attr属性的值（使用JQuery attr（）方法）并将其附加到<ul>元素使用JQuery追加（）方法

以下是完整的JavaScript代码

$( document ).ready(function() {
   var elements=$("div[data-attr]");  

   elements.each(function () {
         $('ul').append('<li>'+$(this).attr('data-attr')+'</li>');  
   });
});

使用jquery在<li>中列出data-attr

6 个答案: