jquery如何元素的值循环显示出来

首先选择需要循环显示的元素，然后用jquery的遍历函数（如each()和map()）将其显示出来即可：

$(selector)each(function(index,element));   // 为每个匹配元素规定运行的函数

$(selector)map(function(index,domElement)); // 对当前集合中的每个元素调用的函数对象

实例演示：点击按钮获取第二个div下所有p标签的值

创建Html元素

<div class="box">

<span>点击按钮获取第二个div下所有p标签的值：</span><br>

<div class="content">

  <p>aaaa</p>

  <p>bbbb</p>

  <p>cccc</p>

</div>  

<div class="content">

  <p>1111</p>

  <p>2222</p>

  <p>3333</p>

</div>  

<div class="content">

  <p>555</p>

  <p>666</p>

  <p>77777</p>

</div>

<input type="button" value="获取第二个div下所有p标签的值">

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox>span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

编写jquery代码

$(function(){ 

$("input:button")click(function() {

text = $("divcontent")eq(1)find("p")map(function(index,elem) {

return $(elem)text();

})get()join(',');

alert("第二个div下p标签依次为："+text);

});

});

观察效果

在开发过程中，jQueryhtml() 是获取当前节点下的html代码，并不包含当前节点本身的代码，然而我们有时候的确需要，可以通过jQueryprop("outerHTML")的方式设置。

很多jQuery的使用者都对这一问题深感疑惑。为什么在众多方便的各种获取属性和设置属性的方法中就不能像DOM中一样直接设置html元素的outerHTML呢？

因为原生JS DOM里有一个内置属性 outerHTML （看清大小写哦，JS是区分大小写的）用来获取当前节点的html代码(包含当前节点)，所以用jQuery的prop()能拿到

一、jquery获取outerhtml

<div class="test"><p>hello，你好！</p></div>

<script>

$("test")prop("outerHTML");

</script>

二、jquery设置outerhtml

 $(

'test'

)prop(

'outerHTML'

, 

'<input>'

);

以上就是关于jquery如何元素的值循环显示出来全部的内容，包括:jquery如何元素的值循环显示出来、怎样用jQuery自带方法/函数来获取outerHTML属性、等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！