jQuery修改伪元素

最新推荐文章于 2022-10-04 16:39:37 发布
最新推荐文章于 2022-10-04 16:39:37 发布
阅读量721 收藏 1
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/xhrr/p/11543992.html
版权

将红色小符号改成绿色

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        div {
            position: relative;
            width: 90px;
            height: 90px;
            background-color: #ff0;
            
        }
        .has:after{
            position:absolute;
            content:'';
            background: #ff514c;
            width: 10px; 
            height: 10px;
            border-radius:50%;
            top: -.1rem;
            right: -.25rem;
            display: block;
        }
    </style>
</head>
<body>
    <div>
        <a href="sysMessage.html" class="point">
            <span class="ico_w has">

            </span>
            <h6 class="tit">我的消息</h6>
        </a>
    </div>  
    <script src="js/jquery-1.8.3.min.js"></script>
    <script>
        $('.point').append("<style>.has::after{background: #0ff}</style>"); 
    </script>
</body>
</html>

　　

 

 

 

转载于:https://www.cnblogs.com/xhrr/p/11543992.html

weixin_30555753
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jQuery修改CSS伪元素属性的方法
10-25
CSS伪元素不是DOM元素，因此你无法直接选择到它们。下面与大家分享两种不错的修改方法，需要的朋友可以参考下
【JQ】jQuery改变css伪元素样式
amyleeYMY的博客
02-27 7917
伪元素是什么？例如 :bofore、:after伪元素不是dom，不能直接操作。若有以下html和css，通过操作伪元素改变图标颜色：&lt;div class = "table-container"&gt; &lt;span class="glyphicon glyphicon-number"&gt;&lt;/span&gt; &lt;/div&gt;.glyphicon-numbe...
通过JQuery增加伪元素:before,:after的方法
m0_46530861的博客
04-06 4642
今天在做网站视频的时候发现巴萨视频的进度条下方有它自己的logo，随着进度条的显示，隐藏变化。 在给网站添加好播放器后发现他视频进度条下方的logo是伪元素，而我在网站上添加的播放器的进度条是通过JQuery来控制显示和隐藏的，网页的html文件中没有相应的地方可添加。所以网上找教程，一般都是修改样式的。仔细琢磨之后发现其实道理都一样。 下面就来记录一下怎么通过JQuery添加伪元素。 Html代...
演示-JQuery中伪元素和伪类选择器
weixin_34110749的博客
10-05 183
HTML代码： 1 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; 2 &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; 3 &lt;...
jQuery对伪类元素进行操作
w19981225的博客
02-05 1596
$(’’).appendTo(‘body’);
JS控制伪元素的方法汇总
10-22
6. **修改伪元素的样式**： 虽然不能直接改变伪元素的内容，但可以通过改变其父元素的样式间接影响伪元素。例如，若需修改`:before`伪元素的背景颜色，可以这样操作： ```javascript element.style.setProperty...
jquery之Document元素选择器篇
10-30
jQuery提供了丰富的操作方法，如`.size()`用于获取匹配元素的数量，`.slideToggle('slow')`实现元素的滑动显示/隐藏，`.append()`用于在元素后添加内容，`.remove()`用于删除元素，`.hide('slow')`则用于渐隐元素，`...
jQuery修改class属性和CSS样式整理
12-12
class属性修改 　类属性即class属性,规定类名. 　用类选择器规定样式的...　用jQuery进行类名修改既可以用attr()方法修改”class”属性,也可以用addClass(), removeClass(), toggleClass()等方法来完成. addClass()
jQuery修改CSS伪元素属性的方法_jquery_脚本之家
测试
01-10 2007
文章目录[隐藏]jQuery修改CSS伪元素属性的方法jQuery修改CSS伪元素属性的方法 更新时间：2014年07月30日 14:51:29 投稿：whsnow 我要评论 . 新疆职业院校 iot开发平台 融合通讯系统 自学大数据 ucla 新疆中专 免费erp系统 源码论坛 网管运维 程序开发学校 .CSS伪元素不是DOM元素，因此你无法直接选择到它们。下面与大家分享两...
jq ‘’操作‘’伪元素
weixin_30666943的博客
02-28 488
1. 伪元素非 dom 元素，jq无法操作，但可以间接影响。 2. 操作方式 2.1 修改类 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-widt...
jQuery修改CSS伪元素属性
陈小峰（iefreer）的专栏
07-29 9274
CSS伪元素（pseudo elements）不是DOM元素，因此
jq修改伪元素属性
qq_44832960的博客
01-06 595
选择到需要修改元素的父盒子然后append进去你需要改的样式就可以了
jQuery学习
qianqianyunyan的博客
10-04 845
jQuery学习
JQuery好像不能获取伪元素（伪类）
Holeran的博客
03-16 1140
在写轮播图的时候，遇到的问题，刚开始写那个两边向左向右的小箭头时，使用的是伪类，然后发现获取不到（可能是我自己没找到合适的方法，如果有希望可以评论一下，谢谢），，昨天也没在网上找到下面是我解决的方法 $(".warp::after")//这样是获取不到的 $(".warp::before") 方法一： 这种应该可以通过获取.warp的孩子得到，再使用eq（）方法得到要加行为的元素 var $after = $(".warp").children(); $after.eq(1)//1是我自己的顺序 方法二
jquery改变选中对象的css,使用jQuery选择和操作CSS伪元素，例如:: before和:: after
weixin_39609071的博客
08-03 1632
DIEA您认为这将是一个简单的问题，jQuery可以做的其他事情。不幸的是，问题归结为一个技术问题：css：after和：之前规则不是DOM的一部分，因此不能使用jQuery的DOM方法进行更改。有一些方法可以使用JavaScript和/或CSS解决方法来操纵这些元素;您使用哪一个取决于您的确切要求。我将从广泛认为的“最佳”方法开始：1)添加/删除预定的类在这种方法中，您已经在CSS中创建了一个...
jquery动态修改:after:before伪元素content值
weixin_45264424的博客
07-09 1530
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jquery动态修改伪类:after:before</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <style>
JavaScript修改CSS伪元素:after和:before的样式
热门推荐
aty
06-29 3万+
CSS伪元素:before和:after可以实现很多有趣的功能，我们项目中使用的ionicframework框架的ionic.css文件中大量使用到了这2个伪元素。伪元素可以用来定义样式，但是和正常的dom元素不同，我们没有办法选中这些伪元素，也就不能像普通元素那样来修改它。我们没有办法直接选中伪元素来修改它的样式，只能是通过新增伪元素来覆盖之前伪元素的样式。
jQuery实现用伪元素给元素加样式
weixin_40758850的博客
06-10 2337
直接上例子吧： 用jQuery改变元素 a 的伪元素的样式，用append的方式即可 $(this).find("a").append(" <style> .mobile-active::after, .mobile-active::before{ opacity:1 } </style>"); ...
jQuery改变css伪元素样式
hello_zcx的博客
08-23 2493
一般的样式，我们大家都可以改变 但是伪元素不是dom元素，不可以直接改变 伪元素类似于before,after之类的 &lt;div class="slide_nav"&gt; &lt;div class="next"&gt;&lt;/div&gt; &lt;/div&gt; .next:before{ content:"999"; color:
过JQuery修改伪元素:before,:after的方法
最新发布
05-25
要修改伪元素的样式，可以使用JQuery的css()方法。但是需要注意的是，伪元素的样式是无法直接修改的，需要通过创建一个新的样式规则来实现。 下面是一个使用JQuery修改伪元素的样例代码： ```javascript // 创建一个新的样式规则 var style = document.createElement('style'); style.type = 'text/css'; style.innerHTML = '.my-element:before { content: "new content"; }'; document.getElementsByTagName('head')[0].appendChild(style); // 给目标元素添加一个类名 $('.my-element').addClass('my-element'); // 修改伪元素样式 $('.my-element').css('color', 'red'); ``` 上面代码的第一部分创建了一个新的样式规则，将其添加到文档头部。第二部分给目标元素添加了一个类名，这样新的样式规则就会应用到目标元素上。第三部分使用JQuery的css()方法修改伪元素的样式。注意，对于伪元素的样式修改，需要在新的样式规则中定义。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值