自定义属性值上的jQuery选择器

我试图理解一些我最初没有编写的jQuery语法

<span id="mySpanElement" toggle-state="ON">Some Sample Text</span>

function switchOff(selectedControl) {
    var fieldName = selectedControl.attr('toggle-state');
    var newState = fieldName.replace("ON", "OFF");
    return $("[toggle-state='" + newState + "']");
}

一些示例文本
功能关闭（选择控制）{
var fieldName=selectedControl.attr（'toggle-state'）；
var newState=fieldName.replace（“开”、“关”）；
返回$（“[切换状态='”+newState+“]]”）；
}

---

在这个函数中，return语句是否会传回对DOM中属性为

toggle state=OFF

的元素的引用？我以前从未见过基于自定义属性的选择器，不确定我是否正确理解了它。

它返回属性

切换状态

等于

关闭的所有元素
选择器
“[toggle state=”+newState+“]””
将匹配文档中属性
toggle state
设置为
newState
（本例中为“关闭”）的每个元素

将该选择器用作jQuery的参数将创建一个包含结果匹配集的jQuery对象。这项工程正被归还

下面是一个简单的演示


功能关闭（）{
var newState=“关”；
返回$（“[toggle state='”+newState+“]]”）
}
$（“#结果”）.text(
//$（“[切换状态='”+newState+“]”）。长度
关闭（）
);
[toggle state=“ON”]{
颜色：绿色；
}
[切换状态=“关闭”]{
颜色：红色；
}

一些示例文本
一些示例文本
一些示例文本
一些示例文本
一些示例文本
函数将返回一个包含所有对象的数组，该数组具有自定义属性，
切换状态
匹配已切换到的任何状态。有趣的概念…作为提示，我想补充一点，当有疑问时，打开Chrome开发者工具，找到代码（在源代码选项卡上），在JavaScript上设置断点，当断点被点击时，切换到控制台选项卡并粘贴到JavaScript中。例如，如果我在return语句上放了一个断点，当它被点击时，我可以将$（“[toggle state='”+newState+“]]）粘贴到控制台选项卡中，它会给出一个答案。