不工作$（this）.removeAttr（'123'）。attr（'456'，''）;

Question

有没有人可以解决这个问题？是关于：attr（123，''）;

例如attr：123 =“”到456 =“”

作品：

/* Works */ 
$('product[123s0s0]').removeAttr('123s0s0').attr('abc123','');
$('product[abc123]').css({'background-color':'#cfc'});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><product 123s0s0 style="background-color: #ccc">123s0s0 to abc123: Works</product></p>
<p><product 456s0s0 style="background-color: #ccc">456s0s0 to 456s0s1: Not</product></p>

不：

$('product[456s0s0]').removeAttr('456s0s0').attr('456s0s1','');
$('product[456s0s1]').css({'background-color':'#cfc'}); 

Answer 1

这是因为那些属性和<product />标签本身是非标准的。它们中的任何一个都可以运行，这几乎是运气。

我建议使用标准的HTML标记，除非你真的想编写自己的doctype，以及data属性来存储你的自定义元数据。试试这个：

$('span[data-123s0s0]').removeAttr('data-123s0s0').attr('data-abc123','');
$('span[data-abc123]').addClass('foo');

$('span[data-456s0s0]').removeAttr('data-456s0s0').attr('data-456s0s1','');
$('span[data-456s0s1]').addClass('foo');

span { background-color: #CCC; }
.foo { background-color: #CFC; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><span data-123s0s0>123s0s0 to abc123: Works</span></p>
<p><span data-456s0s0>456s0s0 to 456s0s1: Works</span></p>

Answer 2

我发现了这个问题。属性名称不能以数字开头。因此，属性的第一个字符必须是字符串或下划线。

$('product[456s0s0]').removeAttr('456s0s0').attr('f456s0s1','');
$('product[456s0s1]').css({'background-color':'#cfc'}); 

Answer 3

似乎attr无法启动宽度数。

HTML解析器（至少在Chrome中）似乎相当宽容，并且会接受无效的属性名称。但是然后尝试通过脚本添加新的无效attiribute将导致此错误（再次在Chrome中）无法在'Element'上执行'setAttribute'：'456s0s1'不是有效的属性名称。 - 彼得B.