Question

在jQuery中，如何在i标记中添加图标？

这是html代码：

<div class="example_infobox1">
    <div class="col-md-3 col-sm-6 col-xs-12">
        <div class="info-box">
            <span class="info-box-icon"><i class=""></i></span>
            <div class="info-box-content">
                <span class="info-box-text">Messages</span>
                <span class="info-box-number">1,410</span>
            </div>
            <!-- /.info-box-content -->
        </div>
        <!-- /.info-box -->
    </div>
    <!-- /.col -->
</div>

以下是我尝试过的代码：

$('.example_infobox4 .i').addClass('fa fa-envelope-o');

我可以请一点帮忙吗？

由于

Answer 1

你选择器错了。 .i会找到包含类i的元素。 i会按标记找到元素。

$('.example_infobox4 i').addClass('fa fa-envelope-o');

或

更具体：

$('.info-box-icon i').addClass('fa fa-envelope-o');

演示：https://jsfiddle.net/tusharj/nfjuk7mq/

Answer 2

<i></i>是HTML中的元素，而不是类。 html中元素的CSS选择器本身就是element。即如果你有以下html，这就是你选择<i></i>

的方法

    <div class="division">
        <i class=""></i>
    </div>

$(".division i").addClass("fa fa-envelop-o");

访问此链接了解更多详情 - CSS Selectors

Answer 3

找到我标记并应用您的课程

的

的
$('body').find('i').addClass('customeClass')

的

请参阅此示例：http://jsfiddle.net/kevalbhatt18/8vvubj1k/

听到我现在不是你的父div，所以我使用body来查找而不是身体使用您的父母选择

或根据您的示例使用此选择器

的

的
$('.example_infobox1').find('i').addClass('fa fa-envelope-o')

的

Answer 4

使用此脚本

var i = document.getElementsByTagName("i");
i.setAttribute("class", "class name");
i.setAttribute("src", "icon link");

将图标添加到html i标记

4 个答案: