querySelector() - 第一个内部元素
querySelector() - first inner element
我正在使用 SVG.js select() 函数，它使用 querySelector() 函数。
目前我使用的命令是：select("[id='1']")（1可以换成其他数字）
我想做的是 select 此元素内的第一个内部元素。或者，我可以通过标签名称 select 它。
怎么做？
我尝试了 select("[id='1']:first") 但收到错误消息。
顺便说一下，我 select 喜欢它的原因显然是 querySelector 的 id 有问题，它是数字。
:first 是 jQuery 的东西。对于您正在做的事情，您可以使用 :first-child，即 a CSS thing:
select("[id='1'] > :first-child");
该选择器匹配所有元素的第一个子元素 id="1"，但如果 select 在幕后使用 querySelector，您将得到 第一个这样的元素。
请注意，其中的 > 是 child combinator: It means we're looking for :first-child within [id='1']. (An earlier version of this answer used [id='1'] :first-child, which uses a descendant combinator [只是空白]。这对于选择元素列表很重要，但如果仅在第一个匹配项上进行选择则无关紧要。）（您需要一个或另一个，因为没有任何组合器（[id='1']:first-child）它将寻找第一个 [id='1'] 那也是一个 :first-child.)
"I'm using SVG.js select() function which uses querySelector() function."
但是你在 TJ 的回答下的评论表明它使用 querySelectorAll()。有区别。
"What I'd like to do is to select the first inner element inside this element."
如果 使用 querySelector，则使用此 select 或：
"[id='1'] > *"
这将为您提供 [id='1'] 元素内的第一个 child 元素。
但如果它实际上使用 querySelectorAll，那么使用 TJ 的 :first-child selector 将起作用，但正如他指出的那样，您需要注意它会 return 所有 个元素是其 parent 的第一个 child。
可以使用>childselect或者保证只有一个
"[id='1'] > :first-child"
"Alternatively, I could select it by tag name. How to do it?"
我不知道您指的是哪个元素，但一般来说，如果 select 或 select 在属性或位置上，则包括标签名称。这将极大地帮助引擎缩小元素集的范围。
// querySelector // querySelectorAll
"div[id='1'] > p" ... "div[id='1'] > :first-child"
"I tried select("[id='1']:first") but received an error."
正如 TJ 指出的那样，这是一个无效的 selector。 jQuery 的 select 或引擎 non-conforming 以几种不同的方式符合标准。尽可能保持你的 selector 纯净，这样你就不会迷上不必要的依赖。
"By the way, the reason I select it like that is that apparently querySelector has a problem with id's which are numbers."
如果您对前导数字进行转义，则可以按数字 select。
"#\1 > *"
我正在使用 SVG.js select() 函数，它使用 querySelector() 函数。
目前我使用的命令是：select("[id='1']")（1可以换成其他数字）
我想做的是 select 此元素内的第一个内部元素。或者，我可以通过标签名称 select 它。
怎么做？
我尝试了 select("[id='1']:first") 但收到错误消息。
顺便说一下，我 select 喜欢它的原因显然是 querySelector 的 id 有问题，它是数字。
:first 是 jQuery 的东西。对于您正在做的事情，您可以使用 :first-child，即 a CSS thing:
select("[id='1'] > :first-child");
该选择器匹配所有元素的第一个子元素 id="1"，但如果 select 在幕后使用 querySelector，您将得到 第一个这样的元素。
请注意，其中的 > 是 child combinator: It means we're looking for :first-child within [id='1']. (An earlier version of this answer used [id='1'] :first-child, which uses a descendant combinator [只是空白]。这对于选择元素列表很重要，但如果仅在第一个匹配项上进行选择则无关紧要。）（您需要一个或另一个，因为没有任何组合器（[id='1']:first-child）它将寻找第一个 [id='1'] 那也是一个 :first-child.)
"I'm using SVG.js
select()function which usesquerySelector()function."
但是你在 TJ 的回答下的评论表明它使用 querySelectorAll()。有区别。
"What I'd like to do is to select the first inner element inside this element."
如果 使用 querySelector，则使用此 select 或：
"[id='1'] > *"
这将为您提供 [id='1'] 元素内的第一个 child 元素。
但如果它实际上使用 querySelectorAll，那么使用 TJ 的 :first-child selector 将起作用，但正如他指出的那样，您需要注意它会 return 所有 个元素是其 parent 的第一个 child。
可以使用>childselect或者保证只有一个
"[id='1'] > :first-child"
"Alternatively, I could select it by tag name. How to do it?"
我不知道您指的是哪个元素，但一般来说，如果 select 或 select 在属性或位置上，则包括标签名称。这将极大地帮助引擎缩小元素集的范围。
// querySelector // querySelectorAll
"div[id='1'] > p" ... "div[id='1'] > :first-child"
"I tried
select("[id='1']:first")but received an error."
正如 TJ 指出的那样，这是一个无效的 selector。 jQuery 的 select 或引擎 non-conforming 以几种不同的方式符合标准。尽可能保持你的 selector 纯净，这样你就不会迷上不必要的依赖。
"By the way, the reason I select it like that is that apparently
querySelectorhas a problem with id's which are numbers."
如果您对前导数字进行转义，则可以按数字 select。
"#\1 > *"