JQuery如何解析文本中的颜色？

如何解析文本中的颜色，如果我键入#40464f，我希望捕获颜色并应用CSS

我知道如何添加标记

 <span data-color=""> #40464f </span>

#40464f

比如说

---

但是我想知道是否可以在不需要手动添加标记的情况下自动执行此操作？

因为我猜这是您希望检查的span中的文本，我认为regexp匹配是您必须要做的

这是一个允许使用regexp选择元素的过滤器

---

既然我猜这是您希望检查的span中的文本，我认为regexp匹配是您必须采取的方法

这是一个允许使用regexp选择元素的过滤器

更改
$（函数（）{
$（“按钮”）。单击（函数（）{
$（'div'）.css（'background-color'，$（'input'）.val（））；
});
});

或者，如果它是您希望更改的文本颜色，只需使用

.css（'color'，$（'input'）.val（））

另外，请注意，您的选择器应该比我的更好

更改
$（函数（）{
$（“按钮”）。单击（函数（）{
$（'div'）.css（'background-color'，$（'input'）.val（））；
});
});

或者，如果它是您希望更改的文本颜色，只需使用

.css（'color'，$（'input'）.val（））

---

另外，请注意，您的选择器应该比我的更好

我并不知道会问什么，我只提供一种在HTML元素中匹配（十六进制）颜色的方法

给定HTML：

<p id="subject">
    Here is a color: #fff. Red is #ff0000 while #9ab57d is another color.
</p>

（）

更新
:

HTML:

这里有一种颜色：#fff。红色是ff0000，而9ab57d是另一种颜色。

JS:

$（函数（）{
var m=$（'#subject'）.text（）.match（/#（？：[0-9a-f]{3}）{1,2}/gi），
$result=$（“#result”）；
$。每个（m，函数（i，v）{
$（'
'）.text（v）.css（'background-color'，v.）.appendTo（$result）；
});
});

更新#2
根据注释，替换inline（）：

HTML:

我们的目标是：40464f&#0f131a

JS:

$（函数（）{
变量$subject=$（“#subject”），
str=$subject.html（）；
str=str.replace（/#（？：[0-9a-f]{3}）{1,2}/gim，“$&”）；
$subject.html（str）；
});

我不知道会问什么，我只提供一种在HTML元素中匹配（十六进制）颜色的方法

给定HTML：

<p id="subject">
    Here is a color: #fff. Red is #ff0000 while #9ab57d is another color.
</p>

（）

更新
:

HTML:

这里有一种颜色：#fff。红色是ff0000，而9ab57d是另一种颜色。

JS:

$（函数（）{
var m=$（'#subject'）.text（）.match（/#（？：[0-9a-f]{3}）{1,2}/gi），
$result=$（“#result”）；
$。每个（m，函数（i，v）{
$（'
'）.text（v）.css（'background-color'，v.）.appendTo（$result）；
});
});

更新#2
根据注释，替换inline（）：

HTML:

我们的目标是：40464f&#0f131a

JS:

$（函数（）{
变量$subject=$（“#subject”），
str=$subject.html（）；
str=str.replace（/#（？：[0-9a-f]{3}）{1,2}/gim，“$&”）；
$subject.html（str）；
});

请解释您试图实现的目标，以便我们正确回答您的问题。即您有一个文本框，希望根据用户在此文本框中的输入将颜色应用于div？？？此属性数据颜色是什么？@ThiefMaster@jensgram理解我的问题，我只想用jQuery解析我的文本，如果文本的颜色为#ff0000，jQuery会在其周围添加一些标记。我的英语不好，所以解释起来不简单。对不起。请解释您试图实现的目标，以便我们能够正确回答您的问题。即您有一个文本框，希望根据用户在此文本框中的输入将颜色应用于div？？？此属性数据颜色是什么？@ThiefMaster@jensgram理解我的问题，我只想用jQuery解析我的文本，如果文本的颜色为#ff0000，jQuery会在其周围添加一些标记。我的英语不好，所以解释起来并不简单。这确实很有用，但是如何直接在解析的元素周围添加标记呢？请不要在结果框里？例如我有这样一个文本：Nous obtenons les 2 couluers suvantes:#40464f和#0f131a。我怎样才能得到这个：我们的目标是：40464f和0f131a。我用你的方法尝试了类似的方法，但不起作用：$（this.prepend（“”.css（'background-color'，v））$（本条）。附加（“”）；有了这一点，您的第一个演示如何演变为检索十六进制和颜色名称，这真的很有用，但是如何直接在解析的元素周围添加标记呢？请不要在结果框里？例如我有这样一个文本：Nous obtenons les 2 couluers suvantes:#40464f和#0f131a。我怎样才能得到这个：我们的目标是：40464f和0f131a。我用你的方法尝试了类似的方法，但不起作用：$（this.prepend（“”.css（'background-color'，v））$（本条）。附加（“”）；有了这一点，你的第一个演示如何演变为检索十六进制和颜色名称

$(function() {
    var m = $('#subject').text().match(/#(?:[0-9a-f]{3}){1,2}/gi);
    // ['#fff', '#ff0000', '#9ab57d']

    $.each(m, function(i, v) {
        // `v` is each color...
    });
});

<p id="subject">
    Here is a color: #fff. Red is #ff0000 while #9ab57d is another color.
</p>
<ol id="result"></ol>

$(function() {
    var m = $('#subject').text().match(/#(?:[0-9a-f]{3}){1,2}/gi),
        $result = $('#result');

    $.each(m, function(i, v) {
        $('<li />').text(v).css('background-color', v).appendTo($result);
    });
});

<p id="subject">
    Nous obtenons les 2 couleurs suivantes : #40464f &amp; #0f131a
</p>

$(function() {
    var $subject = $('#subject'),
        str = $subject.html();

    str = str.replace(/#(?:[0-9a-f]{3}){1,2}/gim, "<span style=\"background-color: $&;\">$&</span>");
    $subject.html(str);
});