Javascript 动态更改CSS内容属性_Javascript_Jquery_Html_Css

Javascript 动态更改CSS内容属性

javascript jquery html css

Javascript 动态更改CSS内容属性,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我的一个朋友从一家公司租了一家网店。他能够从不同的模板中进行选择，并且能够覆盖预定义的CSS并添加javascript片段。他让我帮她做一些修改，但有一件事我无法处理：添加到购物车按钮。在下面的CSS中有一个“content”属性，它保存一个预定义的值。我想根据HTMLlang属性以友好的方式更改此属性的值。你知道我怎样才能做到这一点吗？（我知道如何获取lang属性的值。我的问题是更改“content”属性的值）编写一个Javascript函数来更新CSS。Javascript可以访问HTML

我的一个朋友从一家公司租了一家网店。他能够从不同的模板中进行选择，并且能够覆盖预定义的CSS并添加javascript片段。他让我帮她做一些修改，但有一件事我无法处理：添加到购物车按钮。在下面的CSS中有一个“content”属性，它保存一个预定义的值。我想根据HTMLlang属性以友好的方式更改此属性的值。你知道我怎样才能做到这一点吗？（我知道如何获取lang属性的值。我的问题是更改“content”属性的值）

编写一个Javascript函数来更新CSS。Javascript可以访问HTML属性

document.documentElement.lang

尝试以下操作：

HTML:

JS:

当

的

lang

attr更改时，您会看到“example”前面的字符会更改。

对不起，我不清楚我的请求。我在获取lang属性的值方面没有问题。问题是更改“内容”属性。请参阅，只能使用变通方法。谢谢！我能够解决它：）我改变了你的个人资料图像，@BarnabásNagy；这个在这里不太合适。谢谢

#add_to_cart:before {
    display: block;
    font-family: 'sosa';
    font-size: 35px;
    content: "Ä";
    padding-right: 5px;
    font-weight: 400;
    width: 71px;
    height: 71px;
    line-height: 65px;
    text-align: center;
    text-indent: 0;
    text-shadow: none;
    color: #fff;
}

<html lang="en">
...
<div id="add_to_cart" data-content="">example</div>

#add_to_cart:before {
    display: block;
    font-size: 35px;
    content: attr(data-content);
    padding-right: 5px;
    font-weight: 400;
    width: 71px;
    height: 71px;
    line-height: 65px;
    text-align: center;
    text-indent: 0;
    text-shadow: none;
    color: red;
}

$('#add_to_cart').attr('data-content', (document.documentElement.lang == 'en' ? "x" : "y"));