如何在JavaScript或jQuery中通过类名获取值？

Question

我想使用类名检索此代码的所有值。在jQuery中是否可能？我想仅检索div中的文本或可能更改下一个表单中的div数量。

  <span class="HOEnZb adL">
    <font color="#888888">
    </br>
    <div>
      <i><font color="#3d85c6" style="background-color:#EEE"></i>
    </div>
    <div>
       **ZERONEBYTE Software** |  
       <a target="_blank" href="http://www.example.com">
       **www.zeronebyte.com**
       </a>
       <a target="_blank" href="mailto:[e-mail]">
       **[e-mail]**
       </a>
       </br>
    </div>
    <div>
     <div>
      <div>
        **[phone]** | 
        <a target="_blank" href="**mailto:[e-mail]**"></a>
      </div>
     </div>
    </div>
   </font>
  </span>

- Vikki

---

问题不清楚，请重新表述！ - Rajaprabhu Aravindasamy

期望的输出是什么？ - Arun P Johny

一个包含所有文本的数组 - Vikki

请明确您的问题... - Nemo

从有效的HTML开始会更有帮助。div不能在span元素或font元素内部。* font *元素在HTML 4中已被弃用（15年前），并从HTML 5中删除。浏览器将纠正这些错误，但可能以不同的方式进行，因此您从在此文档中运行的任何脚本中获取的结果在不同的浏览器中可能会有所不同。 - RobG

Answer 1

如果您想获取元素内的文本，请使用text()函数。

$(".element-classname").text();

在您的代码中：

$('.HOEnZb').text();

如果你想获取包含HTML标签在内的所有数据，请使用：

html()

 $(".element-classname").html();

在你的代码中：

$('.HOEnZb').html();

希望能对你有所帮助 :)

- Arunkumar

---

当发现多个同名类时会发生什么？ - That's Enam

Answer 2

试试这个：

$(document).ready(function(){
    var yourArray = [];
    $("span.HOEnZb").find("div").each(function(){
        if(($.trim($(this).text()).length>0)){
         yourArray.push($(this).text());
        }
    });
});

演示

- Kiran

Answer 3

不使用jQuery:

textContent:

文本内容：

var text = document.querySelector('.someClassname').textContent;

标记语言：

var text = document.querySelector('.someClassname').innerHTML;

匹配元素的标记：

var text = document.querySelector('.someClassname').outerHTML;

尽管并非所有感兴趣的浏览器都支持outerHTML，而document.querySelector需要IE 8或更高版本。

- RobG