首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

jQuery 常用方法

:animated 集合元素 $("div: animated") 选取正在执行动画的 元素 表单选择器,利用表单选择器我们可以极其方便地获取表单的某个或某类型的元素,总结如下: 选择器...) 选取所有的复选框 :submit 集合元素 $(":submit") 选取所有的提交按钮 :image 集合元素 $(":image") 选取所有的图像按钮 :reset 集合元素 $(":reset...") 选取所有的重置按钮 :button 集合元素 $(":button") 选取所有的按钮 :file 集合元素 $(":file") 选取所有的上传域 :hidden 集合元素 $(":hidden...") 选取所有不可见元素 常用方法 CSS 样式 $("#id").css(‘backgroundColor’, 'blue’); CSS 样式 .css({‘color’:'red’, 'width....next();· 之后的所有兄弟元素 .nextAll(); 之前的第一个兄弟元素 .prev(); 之后的所有兄弟元素 .prevAll(); 除本身以外的所有兄弟元素 .siblings();

2.6K50

这四种最最常见的按钮类型,设计师必须掌握

请注意,我们将仅讨论规范类型的按钮(也称为简单按钮),不会涵盖切换按钮或单选按钮。 实心按钮 实心按钮是具有实心填充的按钮。大多数时候,设计师使用对比色,这样实心按钮自然会吸引很多注意力。...按钮的圆角和方角 但终归到底,我们要注意,应根据应用程序的样式选择按钮的样式。这意味着如果你所有的 UI 元素都是方形的,那么按钮也不应该是个例外。 视觉一致性是创造良好用户体验的关键。...阴影还可以加强视觉反馈——可以改变 Z 深度来模仿点击按钮的移动感。但与按钮形状类似,阴影的使用应由您的视觉设计决定。如果您使用投影,请确保将这种样式应用于所有按钮类型。...主要的号召性用语按钮将引导用户进行我们希望他们采取的行动,而辅助按钮提供了一个合理的选择。 系统对话框中的空心按钮 对于我们不想分散用户注意力的用户界面,幽灵按钮也是一个不错的选择。...例如,Twitter 移动应用程序使用 FAB 创建推文。 也可以在桌面上使用 FAB,但没有必要这样做,因为我们有足够的屏幕空间。 设计要点 确保所有用户组都清楚地了解图标的含义。

3.9K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    寒假提升 | Day7 CSS 第五部分

    写出盒子模型包含的内容以及如何设置 盒子模型里包含 内容 通过宽度和高度设置 内边距 通过padding设置 padding: padding-top padding-right padding-bottom...常见表单 form 表单, 一般情况下,其他表单相关元素都是它的后代元素 input 单行文本输入框、单选框、复选框、按钮等元素 textarea 多行文本框 select、option 下拉选择框 button...) radio:单选框 checkbox:复选框 button:按钮 reset:重置 submit:提交表单数据给服务器 file:文件上传 readonly:只读 disabled:禁用 checked...的所有表单元素(包括input、textarea、select) 提交按钮(type=submit):提交它所属form的表单数据给服务器(包括input、textarea、select) 我们也可以通过按钮来实现...)的格式是:not(x) x是一个简单选择器 元素选择器、通用选择器、属性选择器、类选择器、id选择器、伪类(除否定伪类) :not(x)表示 除x以外的元素

    1K10

    Web前端JQuery面试题(二)

    function(){ // 程序段 } 前者效率高 $(function(){ // 程序段 }) 2.请问什么是DOM对象?...:not(selector) 获取除给定选择器外的所有元素 first() 或 :first 获取第一个元素 last() 或 :last 获取最后一个元素 内容过滤选择器: :contains(text...表单对象属性过滤选择器: :enabled 匹配所有可用元素 :disabled 匹配所有不可用元素 :checked 匹配所有选中元素 :selected 匹配所有选中option元素 表单选择器:...:input 会获取所有input,textarea,select,button :text 匹配所有单行文本元框 :password 匹配所有密码框 :radio 匹配所有单选按钮 :checkbox...匹配所有复选框 :submit 匹配所有提交按钮 :image 匹配所有图像 :reset 匹配所有重置按钮 :button 匹配所有按钮 :file 匹配所有文本域 5.请问你能写出dom结构吗?

    1.9K30

    最佳设计规范20例

    Alt:字体设计规范 4.段落设置 在实际的产品设计中,段落有很多种样式,不同场景下的段落要求也不一样。比如,阅读内容的段落要求文本可阅读性强,所以对字体、字号、颜色、行间距等要求简单易读。...如果是图标按钮的话,除了上述参数值以外还需要标注icon和按钮文本之间的间距和icon图标的大小。 ?...Alt:进度条的操作流程状态 分页器 分页器是用于切换内容页面的复合组件,常规的分页器有上下页操作按钮、分页页码按钮、输入页码手动查找的搜索框,以及分页器的4个状态:1.Normal 2.Hover ...Alt:数字步进器设计规范 选项卡 切换选项卡即切换内容,和下拉选择框不同的是,选项卡是将多个选项都排列出来的单选组件,需要考虑4个状态:1.Normal 2.Hover  3.Active   4.Disabled...传统意义上的设计规范相当繁琐,并且样式参数值不可复用,和程序对接为0,不能“承上启下”,这也是很多设计师的痛点,所以急需一款走在前沿的设计规范神器。而摹客设计系统就是为设计师而生,国内独家首发。

    2.1K31

    利用微搭快速实现问卷调查功能

    需求分析 这个问卷一共是分成了两个页面,首页是个功能引导页,点击开始问卷可以跳转到具体的问卷提交页,当用户填完各种选项的时候可以点击提交按钮。 题目一共是20道,分为单选、多选、问答题。...[在这里插入图片描述] 输入数据源的名称和标识,点击开始新建按钮 [在这里插入图片描述] 找到数据源字段部分,点击添加字段按钮 [在这里插入图片描述] 首先输入性别字段,考虑到性别需要单选,所以我们选择枚举...,一个引导图片,一个标题,再加一个按钮。...] 然后在容器里添加两个文本组件 [在这里插入图片描述] 选中文本组件,修改一下文本的内容 [在这里插入图片描述] 文本设置好后我们需要解决文本居中的问题,这类问题就需要在容器上设置样式来解决,选中容器组件...[在这里插入图片描述] 总结 今天我带着大家使用微搭低代码工具快速的搭建了一款问卷调查小程序,使用平台的拖拉拽及自动生成的能力开发小程序还是非常方便的,如果你感兴趣,马上注册账号体验吧,也许你就掌握了未来的趋势

    3.5K00

    用幻灯片来汇报数据分析结果,导入导出功能是亮点

    ,不做解析处理; 解析成图片导入的组件有:幻灯片已有的固定样式的形状组件; 解析后的幻灯片的页的排列顺序、组件的叠放层次、位置及大小关系,均保持原ppt中的相对关系不变; 文本框组件相关:文本内容,支持字体...); 文字内容、样式:包括字体颜色(背景颜色目前只有微软2018年11月发布的office2019支持,故不通用),字号大小,字体,粗体,斜体,下划线,中划线,居上中下,左中右设置; 文本组件填充颜色(...,故无互联网则无法展现同时也无法正确导出); 4、形状组件导出支持包括: 形状组件的大小,位置,部分支持编辑文本的形状组件(矩形,菱形,椭圆)的文本导出,文本内容导出同文本组件内容、样式导出; (1)形状组件因为在前台计算位置时会自动取整数...1、导出前设置界面: 导出前设置界面如图: 导出前设置界面所有控件如下:导出文件名输入框、导出图表组件截图间隔时间数字微调器、导出范围单选框组,以及自定义导出幻灯片页数输入框,下面将会对每个功能细节和要求做详细说明...,形式为数字微调器,支持用户设置截图时间间隔(单位:秒),当导出程序执行时,系统会自动每隔指定时间对图表进行截图操作,默认时间为3s,可适用于一般数据量需求制作, 如果用户发现所得幻灯片中图表组件所在位置出现灰色空白图片

    2.9K30

    jQuery就业课程之表单选择器系列

    表单选择器 重要,不难 求同存异,利用之前的知识,迁移过来。判断的是表单的类型,注意,判断的是表单元素的类型,类型,类型。...查找所有文本框: (":text") (:password) 匹配所有密码框 查找所有密码框: (":password") $(:radio) 匹配所有单选按钮 查找所有单选按钮 (:checkbox...(":image") (:reset) 匹配所有重置按钮 查找所有重置按钮: (":reset") (:button) 匹配所有按钮 查找所有按钮: (":button") (:file) 匹配所有文件域...查找所有文件域: (":file") 表单属性过滤器 语法 描述 示例 :enabled 匹配所有可用元素 $(" #userform :enabled" )匹配form内部除编号输入框外的所有元素...:selected" ) 匹配“家乡”中的“北京”选项 2.6 属性操作 jquery的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作 html属性操作:是对html文档中的属性进行读取

    8310

    【收藏】这么多WEB组件(CSS),攒一个网站够了吧?

    [输入框(input)样式图] 演示程序 1.2 单选多选框(checkbox,radio) 浏览器内置的checkbox及radio样式效果太差,本例展示了一个简单大方的单选多选框样式。...需要约25行的CSS代码,额外需要搭配三个png小图标。 [单选多选框(checkbox,radio)样式图] 演示程序 1.3 选择框(select) 一个简单的选择框样式。...[文件选择框(file)样式图] 演示程序 2 非表单相关 2.1 按钮1(button) 一个平面的的按钮样式,配色方案同bootstrap。需要约65行CSS代码。...[按钮1(button)样式图] 演示程序 2.2 按钮2(button) 一个带3D效果的按钮样式。需要约60行的CSS代码。...[按钮2(button)样式图] 演示程序 2.3 模态框(Modal) 一个简单的模态框样式。纯CSS实现,需要约90行的CSS代码。

    3.4K140

    jQuery中的9个选择器

    next :选取当前元素紧邻的下一个同级元素 prev~  siblings :选取当前元素后面的所有同级元素 3、简单选择器 :first :获取第一个元素 :last :获取最后一个元素 :even...:lt(index) 小于,获取索引小于 index 的元素 :not(selector):获取除指定选择器以外的其他元素 4、内容选择器 :contains(text):获取内容包含 text 文本的元素...:empty:获取内容为空的元素 :has(selector) :获取内容包含指定选择器的元素 :parent :获取内容不为空的元素(特殊) 5、可见性选择器 :hidden:获取所有隐藏元素 :visible...:only-child :如果当前元素是唯一的子元素,则匹配 8、表单选择器 :input :选取页面中的所有表单元素,包含 select 以及 textarea 元素 :text :选取页面中的所有文本框...:password:选取所有的密码框 :radio :选取所有的单选按钮 :checkbox:选取所有的复选框 :submit :获取 submit 提交按钮 :reset:获取 reset 重置按钮

    1.6K20

    HTML、CSS、JavaScript学习总结

    “> Type 属性: submit: 提交按钮 reset: 重置按钮 button: 普通按钮 文本框、按钮、单选按钮、复选框等都是输入元素。...它适用于只需要简单地将一些样式应用于某个独立的元素的情况。...mybox 使用数组和for循环大大简化代码 单选按钮对象 • 当用户只需要从选项列表中选择一个选项时,可以使用单选按钮对象 • 要创建单选按钮对象,请使用 标签 单选按钮 – 事件和属性...单选按钮 事件 onBlur 单选按钮失去焦点 onFocus 单选按钮获得焦点 onClick 单选按钮被选定或取消选定 属性 checked 单选按钮是否被选中,选中为true,未选中为false...您可以使用此属性查看单选按钮的状态或设置单选按钮是否被选中 value 设置或获取单选按钮的值 下拉列表框 –请选择开户帐号的城市

    3.2K20

    Android自定义控件

    选择按钮的可扩展性主要体现在 4 个方面: 选项按钮布局可扩展 选项按钮样式可扩展 选中样式可扩展 选择模式可扩展 扩展布局 原生的单选按钮通过RadioButton+ RadioGroup实现,他们在布局上必须是父子关系...,本例中它是一个“上面是图片,下面是文字”的单选按钮。...函数类型变量代替继承 在抽象按钮控件中,“按钮样式”和“按钮选中状态变换”被抽象成算法,算法的实现推迟到子类,用这样的方式,扩展按钮的样式和行为。...继承的一个后果就是类数量的膨胀,有没有什么办法不用继承就能扩展按钮样式和行为? 可以把构建按钮样式的成员方法onCreateView()设计成一个View类型的成员变量,通过设值函数就可以改变其值。...SelectorGroup还预定了两种选中模式:单选和多选。 单选可以理解为:点击按钮时,选中当前的并取消选中之前的。 多选可以理解为:点击按钮时无条件地反转当前选中状态。

    5.9K00

    从零开始学 Web 之 HTML(三)表单

    name:输入框的名字 maxlength:限定输入文本长度 readonly:文本框只读 disabled:文本框未激活 value:输入框中的默认内容 placeholder:引导文字,当文本框无文字并且未获取鼠标焦点时显示引导文字...3、密码输入框 1 PS:文本输入框的所有属性对密码输入框都有效 4、单选框 1单选框是如何设置只能有一个被选中? 只有将 name 的值设置相同的时候,才能实现单选效果。...---- 三、标签语义化 好的语义化的网站标准就是去掉样式表文件(css文件)之后,结构依然很清晰。 根据内容的结构化(内容语义化),选择合适的标签(代码语义化) 有什么用? 1、网页结构合理。...3、不要使用纯样式标签,如:b、font、u 等,改用 css 设置。 4、需要强调的文本,可以包含在 strong 或者 em 标签中。

    2.9K30

    html+css学习笔记011-表单

    Author:Mr.柳上原 付出不亚于任何的努力 愿我们所有的努力,都不会被生活辜负 不忘初心,方得始终 责任与担当 这几天公司招聘文案 好几个应聘上的孩子 答应的好好的第二天来上班 然而却一去不复返...-- 外链样式表 --> /*内部样式表*/ form表单属性 action:' '; 定义数据提交地址 target:' '; 页面打开方式 _block...text; 文本框 password; 密码框 radio; 单选框,需要指定相同的name名称 checkbox; 多选框 button; 按钮,没有特别的功能,多用来结合js提交数据 image;...样式属性: width:' '; 定义宽度 height:' '; 定义高度,ie兼容有问题 子标签 selected:'selected'; 定义默认显示哪项内容...水平方向可以拖动 resize:none; 不允许拖动 分组标签 组标题 input:focus{ } 焦点 /* 适用于

    81730

    纯CSS实现iOS风格打开关闭选择框

    label 元素不会向用户呈现任何特殊效果,标签的作用是为鼠标用户改进了可用性,当用户点击标签中的内容时,浏览器就会自动将焦点转到和该标签相关联的控件上;标签在单选按钮和复选按钮上经常被使用...,使用该标签后,你点击label标签内的内容,也可以选中对应的单选按钮或复选按钮。...——结构上, 是简单的行内元素,所以可使用和 或 元素大致相同的方式来应用样式。...注意: 绝对定位的元素忽略float属性! 2.3 CSS3 :checked 选择器 :checked 选择器匹配每个选中的输入元素(仅适用于单选按钮或复选框)。...例如:选择所有紧接着 元素之后的第一个 元素: div+p{ background-color:yellow; } 3 代码实现 <!

    1.1K41

    纯CSS实现自定义单选框和复选框

    label 元素不会向用户呈现任何特殊效果,标签的作用是为鼠标用户改进了可用性,当用户点击标签中的内容时,浏览器就会自动将焦点转到和该标签相关联的控件上;标签在单选按钮和复选按钮上经常被使用...,使用该标签后,你点击label标签内的内容,也可以选中对应的单选按钮或复选按钮。...——结构上, 是简单的行内元素,所以可使用和 或 元素大致相同的方式来应用样式。...transition-delay 定义transition效果开始的时间 2.4 CSS3 :checked 选择器 :checked 选择器匹配每个选中的输入元素(仅适用于单选按钮或复选框)。...例如:选择所有紧接着 元素之后的第一个 元素: div+p{ background-color:yellow; } 3 代码实现 <!

    94130

    CSS3选择器大全

    3.CSS3 结构性伪类选择器—not :not选择器称为否定选择器,和jQuery中的:not选择器一模一样,可以选择除某个元素之外的所有元素。...就拿form元素来说,比如说你想给表单中除submit按钮之外的input元素添加红色边框,CSS代码可以写成: input:not([type="submit"]){ border:1px solid...用来选择没有任何内容的元素,这里没有内容指的是一点内容都没有,哪怕是一个空格。 比如说,你的文档中有三个段落p元素,你想把没有任何内容的P元素隐藏起来。我们就可以使用:empty选择器来控制。...要正常使用:disabled选择器,需要在表单元素的HTML中设置“disabled”属性。 11.CSS3选择器 :checked选择器 在表单元素中,单选按钮和复选按钮都具有选中和未选中状态。...(大家都知道,要覆写这两个按钮默认样式比较困难)。在CSS3中,我们可以通过状态选择器:checked配合其他标签实现自定义样式。而:checked表示的是选中状态。

    73910

    180多个Web应用程序测试示例测试用例

    3.所有错误消息应以相同的CSS样式显示(例如,使用红色) 4.常规确认消息应使用CSS样式而不是错误消息样式(例如,使用绿色)显示 5.工具提示文本应有意义。...27.检查带有十进制数字值的字段数。 28.检查所有页面上可用按钮的功能。 29.用户不能连续快速按下提交按钮来两次提交页面。 30.任何计算均应除以零误差。...18.页面上的所有按钮都应该可以通过键盘快捷键访问,并且用户应该能够使用键盘执行所有操作。 19.检查所有页面上是否有损坏的图像。 20.检查所有页面上是否有损坏的链接。 21.所有页面都应有标题。...23.当应用程序繁忙时,应该显示沙漏。 24.页面文本应左对齐。 25.用户应该只能选择一个单选选项以及复选框的任意组合。...18.检查单选按钮和下拉列表选项是否正确保存在数据库中。 19.检查数据库字段的设计是否具有正确的数据类型和数据长度。 20.检查所有表约束(例如主键,外键等)是否正确实现。

    8.3K21
    领券