首页 > 解决方案 > 如何获取p元素内的所有跨度数据属性

问题描述

我想获取元素span内的所有数据属性,p以便我可以比较隐藏p元素的值/文本

<div>   
    <ol class="edit-list">
       <li class="edit">
         <p  class="hidden answer" data-answer="He loves fish tacos">He loves fish tacos</p>
         <p>
            <span data-original="Brad">He</span>
            <span data-original="loves">loves</span>
            <span data-original="fish">fish</span>
            <span data-original="tactos">tactos</span>                       
         </p>               
       </li>

       <li class="edit">
         <p  class="hidden answer" data-answer="I love learning!">I love learning!</p>
         <p>
           <span data-original="I">I</span>
           <span data-original="love">love</span>
           <span data-original="learning!">learning!</span>
         </p>
       </li>
       <li class="edit">
          <p  class="hidden answer" data-answer="I ate dinner">I ate dinner</p>
          <p>
             <span data-original="I">I</span>
             <span data-original="ate">ate</span>
             <span data-original="dinner">dinner</span>
           </p>
         </li>
      </ol>
      <button id="validate" >Validate</button>
 </div>

这是我的 JavaScript 代码。

<script type="text/javascript">
  $(function(){
        var mismatch = false;
        $('ol.edit-list li').each(function(){
            var p_answer =  $(this).find('p').attr('data-answer');
            
            var c_annswer =  $(this).find('p').has('span').children().attr('data-original'); // I canno get all the span inside the p;
            
              if(p_answer !== c_answer){
                 mismatch = true;
                 break;
              }
          }         
   });
</script>

标签: javascriptjquery

解决方案


推荐阅读