我有这个布局:
<div id="sectors">
<h1>Sectors</h1>
<div id="s7-1103" class="alpha"></div>
<div id="s8-1104" class="alpha"></div>
<div id="s1-7605" class="beta"></div>
<div id="s0-7479"></div>
<div id="s2-6528" class="gamma"></div>
<div id="s0-4444"></div>
</div>
Run Code Online (Sandbox Code Playgroud)
使用这些CSS规则:
#sectors {
width: 584px;
background-color: #ffd;
margin: 1.5em;
border: 4px dashed #000;
padding: 16px;
overflow: auto;
}
#sectors > h1 {
font-size: 2em;
font-weight: bold;
text-align: center;
}
#sectors > div {
float: left;
position: relative;
width: 180px;
height: 240px;
margin: 16px 0 0 16px;
border-style: solid;
border-width: 2px;
}
#sectors > div::after {
display: block;
position: absolute; …Run Code Online (Sandbox Code Playgroud) 我知道有一个:focus选择器.我似乎无法找到:blur选择器的使用或文档.有吗?
显然,正如我在评论另一个答案时发现的那样,jQuery(而不是它的底层选择器引擎Sizzle)允许你将参数引用到:not()选择器和:has()选择器.即:
$('div:not("span")')
$('span:has("span")')
Run Code Online (Sandbox Code Playgroud)
在Selectors标准中,引号始终代表字符串,而不是选择器或关键字,因此引用参数:not()始终无效.这在选择器4中不会改变.
您还可以通过添加不受支持的CSS选择:nth-last-child(1) 器来查看它是非标准语法,例如导致选择器完全失败:
$('div:not("span"):nth-last-child(1)')
$('span:has("span"):nth-last-child(1)')
Run Code Online (Sandbox Code Playgroud)
在这里允许报价是否有任何理由,技术或其他方面?想到的唯一可能性是:
一致性:contains()允许引用和不引用的参数,如旧的选择器规范中所示.除了:contains()接受字符串/关键字,而不是选择器...
与自定义伪使用的实现保持一致$.expr[':'],始终允许引用和不引用的参数.
一致性和易用性移植到他们的方法同行.not()和.has()(只是删除或拆分外报价和改变冒号期?).
但我找不到任何支持或反对它们的消息来源.实际上,引用选择器参数本身的能力也没有在任何地方记录,引用和引用参数之间似乎没有任何区别:
$('div:not(span)')
$('span:has(span)')
Run Code Online (Sandbox Code Playgroud) 在现代浏览器中,document.querySelectorAll()当使用有效的CSS选择器时,jQuery会利用它来提高性能.如果浏览器不支持选择器或document.querySelectorAll()方法,它会回退到Sizzle .
但是,在调试自定义选择器时,我总是希望使用Sizzle而不是本机实现.也就是说,我试图想出的实现:nth-last-child(),不受jQuery的支持CSS3选择之一.由于现代浏览器本身支持此选择器,因此它的工作方式与链接问题相同.正是这种行为干扰了调试我的自定义选择器,所以我想避免它.
我可以使用的一个便宜的黑客是放入一个非标准的jQuery选择器扩展,从而可以说"使选择器无效".例如,假设每个li:nth-last-child(2)都是可见的,我可以简单地将其删除,转为:
$('li:nth-last-child(2)').css('color', 'red');
Run Code Online (Sandbox Code Playgroud)
进入:
$('li:nth-last-child(2):visible').css('color', 'red');
Run Code Online (Sandbox Code Playgroud)
这导致它总是由Sizzle评估.除此之外,这要求我假设我的页面元素可能是也可能不是.我真的不喜欢那样.更不用说,除非绝对必要,否则我不喜欢使用非标准选择器.
有没有办法document.querySelectorAll()在支持它的浏览器中跳过本机方法并强制jQuery使用Sizzle来评估选择器,最好不使用非标准选择器?可能,这需要调用另一种方法而不是$(),但它比选择器黑客IMO要好得多.
我正在 node.js 中编写一个刮板。是否有一个模块可以让我使用 css 选择器?
请看这个图像:

有人可以解释这个区别吗?
让我指出让我困惑的是什么.请注意:
$row.is('tr.items:last') === false$row[0].id === $('tr.items:last')[0].id这两个陈述似乎相互矛盾.第一个告诉我们这$row不是最后一个tr.items.但第二个告诉我$row的确是$('tr.items:last'),即最后一个tr.items.
:last-of-type选择器不会出现这种情况.
这里发生了什么?
我有一个菜单:only-child选择器,以便我可以指示子菜单.:后选择器在IE8中运行(我必须支持的唯一旧的IE版本),但是:only-child选择器没有,所以我在每个菜单项上都得到一个箭头,而不仅仅是带有子菜单的箭头.
.menu li > a:after { content: ' ?'; }
.menu li > a:only-child:after { content: ''; }
Run Code Online (Sandbox Code Playgroud)
我想要的是使用jQuery或JavaScript实现这一目标.我不想使用Modernizr或Selectivizr以及所有这些东西,只需要一个代码作为only-child的替代品.
如果你能帮助我,我真的很感激.对于jQuery和JavaScript,我是新手,所以请详细解释.谢谢!
它必须迟到......鉴于以下HTML,除了每个段落中的第一段之外,如何选择所有段落div.thePost?
我试过了:
$('.thePost').children('p:gt(0)')
Run Code Online (Sandbox Code Playgroud)
和
$('.thePost p:gt(0)')
Run Code Online (Sandbox Code Playgroud)
和
$('.thePost > p:gt(0)')
Run Code Online (Sandbox Code Playgroud)
所有这些都适用于第一个,div.thePost但最终选择<p>任何其他div中的所有其他标签与类thePost.
<div id="contentmiddle">
<div class="thePost">
<h1>...</h1>
<h3>...</h3>
<span>...</span>
<p>...</p>
<p>...</p>
<p>...</p>
<p>...</p>
</div><!-- /thePost -->
<div class="thePost">
<h1>...</h1>
<h3>...</h3>
<span>...</span>
<p>...</p>
<p>...</p>
<p>...</p>
<p>...</p>
</div><!-- /thePost -->
</div>?<!-- /contentmiddle -->
Run Code Online (Sandbox Code Playgroud) 使用jquery如何用th改变最后一个tr的css
$("#mytable tr").has('th').last().parents('tr').css({'color':'blue'});
Run Code Online (Sandbox Code Playgroud)
HTML
<table border="1" id="mytable">
<tr>
<th>row 1, cell 1</th>
<th>row 1, cell 2</th>
</tr>
<tr>
<th>row 1, cell 1 - change this</th>
<th>row 1, cell 2 - change this</th>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)