Question

实际上，我需要两个数组，分别来自“ id_play”和“ orden_play”两个属性。

我在这里分享我的代码：

let id_play = [];
let orden_play = [];

id_play = $("#listaOrdenable").children().attr('id_play');
orden_play = $("#listaOrdenable").children().attr('orden_play');

<ul id="listaOrdenable" class="s1">
  <li orden_play="0" id_play="47"><img src="uploads/meade.jpg"  width="40" heigth="40">1</li>
  <li orden_play="1" id_play="49"><img src="uploads/videoIcon.png"  width="40" heigth="40">2</li>
  <li orden_play="2" id_play="50"><img src="uploads/RARA.jpg"  width="40" heigth="40">3</li>
  <li orden_play="3" id_play="51"><img src="uploads/videoIcon.png"  width="40" heigth="40">4</li>
</ul>

Answer 1

这是我的解决方案：

id_play = []
orden_play = []

$("#listaOrdenable").children('li').each(function(){
    id_play.push(this.getAttribute('id_play'));
    id_play.push(this.getAttribute('orden_play'));
});

Answer 2

我正在使用jQuerys $ .each来访问列表中的每个属性。我在代码末尾添加了2个循环以进行验证。如果不需要，可以摆脱它们

let id_play = [];
let orden_play =[];

$.each($('#listaOrdenable').children(), function(i,v){
    id_play.push($(this).attr('id_play'));
    orden_play.push($(this).attr('orden_play'));
});

//You can remove these two loops if you don't need them
for(var i in id_play) {
    console.log(id_play[i]);
}
for(var x in orden_play) {
    console.log(orden_play[x]);
}

Answer 3

我有一个简单的javascript解决方案：

const arr1 = [].map.call(document.getElementById('listaOrdenable').querySelectorAll('li'), li => li.getAttribute('orden_play'))

const arr2 = [].map.call(document.getElementById('listaOrdenable').querySelectorAll('li'), li => li.getAttribute('id_play'))

我基本上要做的是从li中选择所有ul节点，然后将它们映射并获取所需的属性。 [].map.call的用途是querySelectorAll()返回一个NodeList，它是一个类似数组的结构。它没有所有的数组函数，因此我使用的.call方法是在类似数组的结构上使用数组函数的方法。

我尚未在jQuery中对其进行测试，但我假设.children()函数将返回示例中querySelectorAll()返回的结果。

希望这会有所帮助，加油！

Answer 4

最简单的纯JS解决方案：

let id_play = [].slice.call(document.querySelectorAll("li[id_play]"));
let orden_play = [].slice.call(document.querySelectorAll("li[orden_play]"));

此方法使用David Walsh's proposal将NodeList转换为Array。您也可以使用Array.from()。参见此link。

但是，我必须再添加一个。使用ES6 spread operator，这是迄今为止最优雅的方法。

ES6解决方案：

let id_play = [...(document.querySelectorAll("li[id_play]"))];
let orden_play = [...(document.querySelectorAll("li[orden_play]"))];

Answer 5

您可以在元素listaOrdenable的所有子元素上使用JQuery each，然后在相关数组上push使用要查找的属性。检查下一个示例：

$(document).ready(function()
{
    var id_play = [];
    var orden_play = [];

    $("#listaOrdenable").children().each(function()
    {
        id_play.push($(this).attr("id_play"));
        orden_play.push($(this).attr("orden_play"));
    });
    
    console.log(id_play);
    console.log(orden_play);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul id="listaOrdenable" class="s1">
  <li orden_play="0" id_play="47"><img src="uploads/meade.jpg"  width="40" heigth="40">1</li>
  <li orden_play="1" id_play="49"><img src="uploads/videoIcon.png"  width="40" heigth="40">2</li>
  <li orden_play="2" id_play="50"><img src="uploads/RARA.jpg"  width="40" heigth="40">3</li>
  <li orden_play="3" id_play="51"><img src="uploads/videoIcon.png"  width="40" heigth="40">4</li>
</ul>

在这种情况下，要将元素保存为整数，则必须使用下一个代码：

id_play.push(Number($(this).attr("id_play")));
orden_play.push(Number($(this).attr("orden_play")));

Answer 6

id_play = [] orden_play = []

$（“＃listaOrdenable li”）。each（function（）{ id_play.push($(this).attr('id_play')); id_play.push($(this).attr('orden_play')); }）;

Answer 7

Vue.component('altoke-flyers',{
 props: ['ac'],
 template: `
  <div>
      <div class="isquierda">izquierda</div>
      <div class="list">
       <label class="img" for="Slide6" >
        <div v-html="ac.sex" class="lege"></div>
        <img v-bind:src="'./files/ski/webcompleta/files/media/img/img/flyers/' + ac.qui  + '/124-186.jpg'">
       </label>
      </div>
      <div class="derecha">derecha</div>
  </div>
  `
})
Vue.component('altoke-capas',{
 props: ['ab', 'a_c'],
 template: `
  <label class="Slide">
   <altoke-flyers v-for="(ac, nc) in a_c" 
     :key="nc++"
     :ac="ac"
    v-if="ab.a > 0"
    v-bind:class="'content ' + ab.b"
   ></altoke-flyers>
   <altoke-flyers 
    v-if="ab.a > 0"
    v-bind:class="'content ' + ab.c"
   ></altoke-flyers>
  </label>
  `
})

var app = new Vue({
 el:'.altoke',
 data: {
  mostrar: false,
  a_a: [
     { a: "", b: "pel", m: 0, n: false },
     { a: "Inicio", b: "home", m: 1, n: true },
     { a: "Pedidos", b: "comment", m: 1, n: false },
     { a: "Reporte", b: "bullhorn", m: 1, n: false },
     { a: "Generos", b: "list-alt", m: 1, n: false},
     { a: "Nosotros", b: "chalkboard-teacher", m: 1, n: false},
     { a: "", b: "pel", m: 1, n: false },
     { a: "", b: "pel", m: 1, n: false },
  ],
  a_b: [
     { a: "1", b: "pels", c: "sers", m: 0, n: false },
     { a: "0", b: "", c: "", m: 1, n: true },
     { a: "0", b: "", c: "", m: 1, n: false },
     { a: "0", b: "", c: "", m: 1, n: false },
     { a: "0", b: "", c: "", m: 1, n: false},
     { a: "0", b: "", c: "", m: 1, n: false},
  ],
  a_c:[],
 },
 created: function(){
  if (localStorage.getItem('vlist')){
   try {
    this.a_c = JSON.parse(localStorage.getItem('vlist'));
   } catch(e) {
   localStorage.removeItem('vlist');
   }
  } else {
   this.get_contacts();
  }     
 },

 methods:{
  get_contacts: function(){
   //const options = { method: 'post', body: 'foo=bar&test=1' }
   fetch("./files/icl/master.php")
   .then(response=>response.json())
   .then(json=>{localStorage.setItem('vlist', JSON.stringify(this.a_c=json.contactos))}) 
  }
 },
})

Javascript，如何将标记属性中的所有值放入数组中？

7 个答案: