如何使用jQuery修改固定表头的上边框颜色？

没问题！要修改这段固定表头代码里的上边框颜色，你只需要在处理粘性表头的部分，给对应的th和td元素添加边框颜色的CSS设置就行。我已经帮你调整了代码，具体看下面：

jQuery(document).on("stickyTable",function(){
    navigator.userAgent.match(/Trident\/7\./)&&$(".sticky-table").on("mousewheel",function(t){
        console.log(t),t.preventDefault();
        var l=t.originalEvent.wheelDelta,s=$(this).scrollTop();
        $(this).scrollTop(s-l)
    }),
    $(".sticky-headers").scroll(function(){
        // 这里添加了border-top-color的设置，替换成你想要的颜色即可
        $(this).find("table tr.sticky-row th").css({
            "top": $(this).scrollTop(),
            "border-top-color": "#ff4500" // 自定义上边框颜色
        }),
        $(this).find("table tr.sticky-row td").css({
            "top": $(this).scrollTop(),
            "border-top-color": "#ff4500" // 自定义上边框颜色
        })
    }).scroll(),
    $(".sticky-ltr-cells").scroll(function(){
        $(this).find("table th.sticky-cell").css("left",$(this).scrollLeft()),
        $(this).find("table td.sticky-cell").css("left",$(this).scrollLeft())
    }).scroll(),
    $(".sticky-rtl-cells").scroll(function(){
        var t=$(this).find("table").prop("clientWidth")-$(this).prop("clientWidth");
        $(this).find("table th.sticky-cell").css("right",t-$(this).scrollLeft()),
        $(this).find("table td.sticky-cell").css("right",t-$(this).scrollLeft())
    }).scroll()
}),
$(document).ready(function(){
    $(document).trigger("stickyTable")
});

关键修改说明： #

• 我把原来单独设置top属性的.css()方法改成了对象形式，同时添加了border-top-color属性，你可以把#ff4500替换成任何你需要的颜色值（比如十六进制、RGB值或者颜色名称）。
• 如果你只需要表头的th元素改变上边框颜色，只保留th对应的那行设置就行，td的可以去掉。

这样当表头固定滚动时，上边框的颜色就会按照你设置的显示啦！

内容的提问来源于stack exchange，提问作者yubinlee