问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

js如何获取多个共同class的标签内容集合？

头像
小熊flippy
    28914
    头像
    清蒸不是水煮
      3.1k21026
      <img image-code="#qq_1_gif#" class="emoji_icon" src="image/qq/1.gif">
<img image-code="#qq_2_gif#" class="emoji_icon" src="image/qq/2.gif">

      如代码所示，我想要获取 class 是 emoji_icon 的 image-code 标签里的内容，结果应该是#qq_1_gif#，#qq_2_gif#，两个内容，我是这么写的

      var code = $(".emoji_icon").attr("image-code");

      结果只获取到了#qq_1_gif#，请问该怎么做？

      java-webhtmljavascript
      阅读 6.8k
      6 个回答
      得票最新
      头像
      1429015561qqcom
        32839
        ✓ 已被采纳
        var arr= $(".emoji_icon");
var arr1=[];
arr.each(function(){
    arr1.push($(this).attr("image-code"));
});
        头像
        playboy5566
          3.1k730

          加个for循环就行了啊

          头像
          T_one
            1.3k51531

            document.querySelectorAll('.emoji_icon');
            然后for循环

            头像
            hevi1991
              113311
              <img image-code="#qq_1_gif#" class="emoji_icon" src="image/qq/1.gif">
<img image-code="#qq_2_gif#" class="emoji_icon" src="image/qq/2.gif">

<script
  src="https://code.jquery.com/jquery-1.12.4.min.js"
  integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
  crossorigin="anonymous"></script>

<script type="text/javascript">
    var arr = [];
    $(".emoji_icon").each(function(index,item){
        console.log();
        var imageCode = $(item).attr("image-code");
        arr.push(imageCode);
    })
    console.log(arr)
</script>
              头像
              LishiJ
                295916

                由于通过class获取的元素是一个集合，所以直接用.attr()方法时不能将所有内容获取到，可以利用楼上的循环方法，依次将attr值获取到并push到一个数组中。
                也可以使用ES6中的map,和循环原理一样

                var imgArr= $(".emoji_icon");
var arr = imgArr.map(function(item) {
   return imgArr.eq(item).attr('data-code'); 
});
                头像
                我不是艾克
                  52445676

                  <!DOCTYPE html>
                  <html>
                  <head>

                  <title>test</title>

                  </head>
                  <body>
                  <img image-code="#qq_1_gif#" class="emoji_icon" src="image/qq/1.gif">
                  <img image-code="#qq_2_gif#" class="emoji_icon" src="image/qq/2.gif">
                  <script type="text/javascript">

                  let emoji_icons = document.querySelectorAll('.emoji_icon');
emoji_icons.forEach((emoji_icon) => {
    let val= emoji_icon.getAttribute('image-code');
    console.log(val);
})

                  </script>
                  </body>
                  </html>

                  这总简单的就别用jq了，你的$(".emoji_icon") 得到的是对象，没有这种操作的，要先获取每个里面的dom
                  你直接复制我的代码看下就知道了，用的是ES6的语法

                  撰写回答
                  你尚未登录，登录后可以
                  • 和开发者交流问题的细节
                  • 关注并接收问题和回答的更新提醒
                  • 参与内容的编辑和改进，让解决方法与时俱进
                  推荐问题