为什么 jquery 选择器不能在所有存在与其选择器匹配的有效元素的情况下工作？

Question

我有一个简单的 jquery 选择器，用于查找父级并设置他们的 css，但是完全错过了一些确实具有选择器正在寻找的元素。 它确实找到的那些根据图像以红色边框。

我正在寻找 Class ="accordion-heading" 的父级。 我已经尝试过 parents 以及 parent().parents()..但它仍然没有看到一些具有此类的元素。

jq 是

var fullparent = BranchChkBoxArray[i][0];
$('#' + fullparent).parent().parent(".accordion-heading").css({ "color": "red", "border": "2px solid red" });

标记是

<li>
	<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#MMID_0">
		<span class="checkbox MMTree-checkbox styled red"><input name="MM_0" class="MMTree-checkbox styled red" id="MM_0" style="display: none;" type="checkbox" value="false" iid="0"></span>
		Admin
	</span>
	<ul class="nav nav-list collapse in" id="MMID_0" aria-expanded="true" style="padding-left: 20px;">
		<li>
			<span class="accordion-heading" aria-expanded="false" data-toggle="collapse" data-target="#submenu_0_0">
				<span class="checkbox subtree-checkbox styled red"><input name="SM_0_0" class="subtree-checkbox styled red" id="SM_0_0" style="display: none;" type="checkbox" value="false" iid="1"></span>
				Debtors-Creditors
			</span>
			<ul class="nav nav-list collapse" id="submenu_0_0" aria-expanded="true" style="padding-left: 20px;">
				<li>
					<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#submenu_0_0SM_0_00">
						<span class="checkbox subtree-checkbox styled red"><input name="Pr_SM_0_00" class="subtree-checkbox styled red" id="Pr_SM_0_00" style="display: none;" type="checkbox" value="false" iid="0"></span>
						Read
					</span>
				</li>
				<li>
					<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#submenu_0_0SM_0_10">
						<span class="checkbox subtree-checkbox styled red"><input name="Pr_SM_0_10" class="subtree-checkbox styled red" id="Pr_SM_0_10" style="display: none;" type="checkbox" value="false" iid="0"></span>
						Create
					</span>
				</li>
				<li>
					<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#submenu_0_0SM_0_20">
						<span class="checkbox subtree-checkbox styled red"><input name="Pr_SM_0_20" class="subtree-checkbox styled red" id="Pr_SM_0_20" style="display: none;" type="checkbox" value="false" iid="0"></span>
						Update
					</span>
				</li>
				<li>
					<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#submenu_0_0SM_0_30">
						<span class="checkbox subtree-checkbox styled red"><input name="Pr_SM_0_30" class="subtree-checkbox styled red" id="Pr_SM_0_30" style="display: none;" type="checkbox" value="false" iid="0"></span>
						Delete
					</span>
				</li>
			</ul>

		</li>
		<li>
			<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#Smenu_0_1__1">
				<span class="checkbox subtree-checkbox styled red"><input name="SM_0_1" class="subtree-checkbox styled red" id="SM_0_1" style="display: none;" type="checkbox" value="false" iid="1"></span>
				Users
			</span>
			<ul class="nav nav-list collapse in" id="Smenu_0_1__1" aria-expanded="true" style="padding-left: 60px;">
				<li>
					<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#Smenu_0_1__10">
						<span class="checkbox subtree-checkbox styled red">
						<input name="SM_0_1_1" class="subtree-checkbox styled red" id="SM_0_1_1" style="display: none;" type="checkbox" value="false" iid="2"></span>
						new subby tst3
					</span>
					<ul class="nav nav-list collapse in" id="Smenu_0_1__10" aria-expanded="true" style="padding-left: 20px;">
						<li>
							<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#Smenu_0_1__10SM_0_1_1_00">
								<span class="checkbox subtree-checkbox styled green checked">
								<input name="Pr_SM_0_1_1_00" class="subtree-checkbox styled red" id="Pr_SM_0_1_1_00" style="display: none;" type="checkbox" value="false" iid="0"></span>
								Read
							</span>
						</li>
						<li>
							<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#Smenu_0_1__10SM_0_1_1_10">
								<span class="checkbox subtree-checkbox styled red">
								<input name="Pr_SM_0_1_1_10" class="subtree-checkbox styled red" id="Pr_SM_0_1_1_10" style="display: none;" type="checkbox" value="false" iid="0"></span>
								Create
							</span>
						</li>
						<li>
							<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#Smenu_0_1__10SM_0_1_1_20">
								<span class="checkbox subtree-checkbox styled red">
								<input name="Pr_SM_0_1_1_20" class="subtree-checkbox styled red" id="Pr_SM_0_1_1_20" style="display: none;" type="checkbox" value="false" iid="0"></span>
								Update
							</span>
						</li>
						<li>
							<span class="accordion-heading" aria-expanded="true" data-toggle="collapse" data-target="#Smenu_0_1__10SM_0_1_1_30">
								<span class="checkbox subtree-checkbox styled red"><input name="Pr_SM_0_1_1_30" class="subtree-checkbox styled red" id="Pr_SM_0_1_1_30" style="display: none;" type="checkbox" value="false" iid="0"></span>
								Delete
							</span>
						</li>
					</ul>
				</li>
			</ul>

		</li>
		<li>
			<span class="accordion-heading" aria-expanded="false" data-toggle="collapse" data-target="#Smenu_0_1__2">
				<span class="checkbox subtree-checkbox styled red"><input name="SM_0_2" class="subtree-checkbox styled red" id="SM_0_2" style="display: none;" type="checkbox" value="false" iid="1"></span>
				Contacts
			</span>
			<ul class="nav nav-list collapse" id="Smenu_0_1__2" style="padding-left: 60px;">
				<li></li>
			</ul>
		</li>
		<li>
			<span class="accordion-heading" aria-expanded="false" style="border: 2px solid red; border-image: none; color: red;" data-toggle="collapse" data-target="#submenu_0_3">
				<span class="checkbox subtree-checkbox styled red">
				<input name="SM_0_3" class="subtree-checkbox styled red" id="SM_0_3" style="display: none;" type="checkbox" value="false" iid="1"></span>
				Security
			</span>
			<ul class="nav nav-list collapse" id="Smenu_0_1__2" style="padding-left: 60px;">
				<li></li>
			</ul>
		</li>
	</ul>
</li>

应用的红色边框 css 的图像。

Answer 1

我不完全知道您在什么时候尝试为节点着色（它们都已加载吗？），但我会尝试抓住列表并使用.find()

也许这适用于您的情况：

listHead.find('.accordion-heading').each(function () {
  $(this).css({ "color": "red", "border": "2px solid red" });
}