在JQuery中设置$(this).text的样式

Styling $(this).text in JQuery

本文关键字:text 样式 this JQuery 设置      更新时间:2023-09-26

是在JQuery中设置文本样式的一种方式,例如:

例如。当我点击"显示表格"按钮时,它将由红色变为蓝色。

$(document).ready(function () {
    $('#hide').on('click', function () {
        if ($('#category-table').is(':visible')) {
            $(this).text("Show Table"); /*style this text color: red;*/
            $('#category-table').hide();
        } else {
            $(this).text("Hide Table"); /*style this text color: blue;*/
            $('#category-table').show();
        }
    });
});

使用.css()函数指定元素的样式:

$(this).text("Show Table").css('color', 'red');

或者你可以有CSS类,例如

.red {
    color: red;
}
.blue {
    color: blue;
}

并添加类:

$(this).text("Show Table").removeClass("blue").addClass("red");

使用jQuery.css()方法。

例如$(this).text("Show Table").css('color', 'red');

您似乎在使用jQuery。

$(this).css('color', '#ff0000'); /*style this text color: red;*/
$(this).text("Show Table");

$(this).css('color', '#0000ff'); /*style this text color: blue;*/
$(this).text("Hide Table");
$(document).ready(function () {
  $('#hide').on('click', function () {
    if ($('#category-table').is(':visible')) {
        $(this).text("Show Table"); /*style this text color: red;*/
        $(this).css("color","red"); // if you want set color (you can set color as 'red' or '#ff0000')
        $(this).addClass("myRedClass"); //this is better, you can set class and change him in styles
        $('#category-table').hide();
    } else {
        $(this).text("Hide Table"); /*style this text color: blue;*/
        /* copy from red  */
        $('#category-table').show();
    }
  });
});