关于$(":button") 选择器的理解

简介: 关于$(":button") 选择器的理解

通过 $(":button") 可以选取所有 type="button" 的 input 元素 和 button 元素,
如果去掉冒号,$("button")只能获取 button 元素。

测试
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
    $(document).ready(function(){
        $("#test1").click(function(){
            $("button").hide();
        });
        $("#test2").click(function(){
            $(":button").hide();
        });
    });
</script>
</head>
<body>
    <p id="test1">点进这里测试  <b>button</b></p>
    <p id="test2">点进这里测试 <b>:button</b></p>
    <button>Button 按钮</button>
    <input type="button" value="Input 按钮">
</body>
</html>
目录
相关文章
|
前端开发 JavaScript 开发者
利用 SplitingJS 配合 CSS 实现文字&quot;蠕动&quot;效果
利用 SplitingJS 配合 CSS 实现文字&quot;蠕动&quot;效果
375 2
|
2月前
E[att^=value] 属性选择器和E[att$=value] 属性选择器
E[att^=value] 属性选择器和E[att$=value] 属性选择器。
40 0
【已解决】Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>
Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>
483 0
【已解决】Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>
|
JavaScript 编译器
模块 &quot;&quot;element-plus&quot;&quot; 没有导出的成员 &quot;ElMessage&quot;。你是想改用 &quot;import ElMessage from &quot;element-plus&quot;&quot; 吗?
模块 &quot;&quot;element-plus&quot;&quot; 没有导出的成员 &quot;ElMessage&quot;。你是想改用 &quot;import ElMessage from &quot;element-plus&quot;&quot; 吗?
373 0
|
前端开发
CSS之选择器(十)&lt;label&gt; 和 &lt;input&gt;
CSS之选择器(十)&lt;label&gt; 和 &lt;input&gt;
CSS之选择器(十)&lt;label&gt; 和 &lt;input&gt;
|
JavaScript
理解JS函数调用和&quot;this&quot;
如果理解核心函数的调用机制,同时验证一些以核心函数为基础的其他实现方式的运行机制,关于上述所说的问题就会迎刃而解。
105 0
|
Web App开发 前端开发 JavaScript
神奇的选择器 :focus-within
神奇的选择器 :focus-within
173 0
神奇的选择器 :focus-within
|
Web App开发 前端开发 JavaScript
神奇的选择器 :focus-within
神奇的选择器 :focus-within
143 0
|
Web App开发 前端开发 Android开发
利用 :placeholder-shown 选择器实现 label 浮动效果
本文讲的是利用 :placeholder-shown 选择器实现 label 浮动效果,设计师似乎喜欢用 浮动 label 模式 来设计华丽的效果,虽然我不确定我是否百分百喜欢这种方式,但我忍不住快速实现了一个这样的 demo。
1811 0
|
前端开发
CSS-选择器11-first-of-type、last-of-type、nth-of-type 和 nth-last-of-type
CSS选择器-系列文章 1、选择器说明 选择器 例子 例子描述 CSS :first-of-type p:first-of-type 选择属于其父元素的首个 p 元素的每个 p 元素。
1021 0