js选择器手机版js编辑器

编程之家2026-06-06959次浏览

大家好，如果您还对js选择器不太了解，没有关系，今天就由本站为大家分享js选择器的知识，包括手机版js编辑器的问题都会给大家分析到，还望可以解决大家的问题，下面我们就开始吧！

jquery中简单过滤选择器有哪些

1.基本过滤选择器

a)":first"，选取第一个元素，别忘记它也是被放在一个集合里哦！因为JQuery它是DOM对象的一个集合。如，“$("tr:first")”返回所有tr元素的第一个tr元素，它仍然被保存在集合中。

b)“:last”，选取最后一个元素。如，“$("tr:last")”返回所有tr元素的最后一个tr元素，它仍然被保存在集合中。

c)“:not(selector)”，去除所有与给定选择器匹配的元素。如，“$("input:not(:checked)")”返回所有input元素，但去除被选中的元素（单选框、多选框）。

d)“:even”，选取所有元素中偶数的元素。因为JQuery对象是一个集合，这里的偶数指的就是集合的索引，索引从0开始。

e)“:odd”，选取所有元素中奇数的元素，索引从0开始。

f)“:eq(index)”，选取指定索引的元素，索引从0开始。

g)“:gt(index)”，选取索引大于指定index的元素，索引从0开始。

h)“:lt(index)”，选取索引小于指定index的元素，索引从0开始。

i)“:header”，选取所有的标题元素，如hq、h2等。

j)“:animated”，选取当前正在执行的所有动画元素。

2).内容过滤选择器

它是对元素和文本内容的操作。

a)“:contains(text)”，选取包含text文本内容的元素。

b)“:empty”，选取不包含子元素或者文本节点的空元素。

c)“:has(selector)”，选取含有选择器所匹配的元素的元素。

d)“:parent”，选取含有子元素或文本节点的元素。（它是一个父节点）

3).可见性过滤选择器

根据元素的可见与不可见状态来选取元素。

“:hidden”，选取所有不可见元素。

“:visible”，选择所有可见元素。

可见选择器：hidden不仅包含样式属性 display为 none的元素，也包含文本隐藏域(<input type=“hidden”>)和 visible:hidden之类的元素。

4).属性过滤选择器

通过元素的属性来选取相应的元素。

a)“[attribute]”，选取拥有此属性的元素。

b)“[attribute=value]”，选取指定属性值为value的所有元素。

c)“[attribute!=value]”，选取属性值不为value的所有元素。

d)“[attribute ^= value]”，选取属性值以value开始的所有元素。

e)“[attribute$= value]”，选取属性值以value结束的所有元素。

f)“[attribute*= value]”，选取属性值包含value的所有元素。

g)“[selector1] [selector2]…[selectorN]”，复合性选择器，首先经[selector1]选择返回集合A，集合A再经过[selector2]选择返回集合B，集合B再经过[selectorN]选择返回结果集合。

5).子元素过滤选择器

一看名字便是，它是对某一元素的子元素进行选取的。

a)“:nth-child(index/even/odd)”，选取索引为index的元素、索引为偶数的元素、索引为奇数的元素。

l nth-child(even/odd)：能选取每个父元素下的索引值为偶(奇)数的元素。

l nth-child(2)：能选取每个父元素下的索引值为 2的元素。

l nth-child(3n)：能选取每个父元素下的索引值是 3的倍数的元素。

l nth-child(3n+ 1)：能选取每个父元素下的索引值是 3n+ 1的元素。

b)“:first-child”，选取第一个子元素。

c)“:last-child”，选取最后一个子元素。

d)“:only-child”，选取唯一子元素，它的父元素只有它这一个子元素。

6).表单过滤选择器

选取表单元素的过滤选择器。

a)“:input”，选取所有<input>、<textarea>、<select>和<button>元素。

b)“:text”，选取所有的文本框元素。

c)“:password”，选取所有的密码框元素。

d)“:radio”，选取所有的单选框元素。

e)“:checkbox”，选取所有的多选框元素。

f)“:submit”，选取所有的提交按钮元素。

g)“:image”，选取所有的图像按钮元素。

h)“:reset”，选取所有重置按钮元素。

i)“:button”，选取所有按钮元素。

j)“:file”，选取所有文件上传域元素。

k)“:hidden”，选取所有不可见元素。

7).表单对象属性过滤选择器

选取表单元素属性的过滤选择器。

“:enabled”，选取所有可用元素。

“:disabled”，选取所有不可用元素。

“:checked”，选取所有被选中的元素，如单选框、复选框。

“:selected”，选取所有被选中项元素，如下拉列表框、列表框。

js选项卡设计的要点有哪些

1、javaScript与java的区别？（从它们的解释，运行等方面说）

第一，javascript是基于对象的，而java是面向对象，即java是一种真正的面向对象的语言，即使是开发简单的程序，必须设计对象。Javascript是种脚本语言，它可以用来制作与网络无关的，与用户交互作用的复杂软件。它是一种基于对象和事件驱动的编程语言。因而它本身提供了非常丰富的内部对象供设计人员使用。

第二，两种语言在其浏览器中所执行的方式不一样。Java的源代码在传递到客户端执行之前，必须经过编译，因而客户端上必须具有相应平台上的仿真器或解释器，它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。Javascript是一种解释性编程语言，由浏览器解释执行。

第三，两种语言所采取的变量时不一样的。Java采用强类型变量检查，即所有变量在编译之前必须作声明avaScript中变量声明，采用其弱类型。即变量在使用前不需作声明，而是解释器在运行时检查其数据类型。

第四，代码格式不一样。Java是一种与HTML无关的格式，必须通过像HTML中引用外媒体那么进行装载，其代码以字节代码的形式保存在独立的文档中。JavaScript的代码是一种文本字符格式，可以直接嵌入HTML文档中，并且可动态装载。编写HTML文档就像编辑文本文件一样方便。

第五，嵌入方式不一样。在HTML文档中，两种编程语言的标识不同，JavaScript使用<script>...</script>来标识，而Java使用<applet>...</applet>来标识。

2、请用JavaScript写出提交表单的语句表单为 frm1

frm1.submit();

3、在javascript中如何判断一个变量是否是数值型？

答：判断变量是不是数字，用javascript的内置函数 isNaN()就可以了，isNaN()函数检验参数是否是一个数字，要注意的是不是数字返回true，是的话返回false。

4、form表单中的控件都由那些？

答：form表单包含

单行文本输入框(text)

单选按钮(radio)

复选框(checkbox)

重置按钮(reset)

多行文本框(textarea)

密码框(password)

下拉列表(select)

提交按钮(submit)

注意：hidden属性可以设置控件是否隐藏。

5、表单提交的方式有哪些？

答：表单提交方式比较：

l get的特点是信息暴露、长度不能超过255字节，但是速度快。

l post的特点信息隐藏、长度不限，但是速度较慢。

6、插入视频到页面

7、如何将JavaScript嵌入网页？

a、使用<script>标签将语句嵌入文档

b、将 JavaScript源文件链接到 HTML文档中

8、JavaScript对象有哪些？（比较重要）

答：浏览器窗口：window文档； document；url地址等

脚本对象： String字符串对象；Date日期对象；Math数学对象等

HTML对象：各种HTML标签:段落<P>；图片<IMG>；超链接<A>等

9、JavaScript事件有哪些？

事件名

说明

onClick

鼠标单击

onChange

文本内容或下拉菜单中的选项发生改变

onFocus

获得焦点，表示文本框等获得鼠标光标。

onBlur

失去焦点，表示文本框等失去鼠标光标。

onMouseOver

鼠标悬停，即鼠标停留在图片等的上方

onMouseOut

鼠标移出，即离开图片等所在的区域

onMouseMove

鼠标移动，表示在<DIV>层等上方移动

onLoad

网页文档加载事件

onSubmit

表单提交事件

onMouseDown

鼠标按下

onMouseUp

鼠标弹起

12、innerHTML是用来做什么的？（innerHTML和innerTEXT的区别）

答：innerHTML可以获取或修改某个HTML标签内包含的内容(包括标签与文本)

<div id=“div1”><h2>innerHTML</h2></div>

document.getElementById(“div1”).innerHTML;

</script>

13、如何使用外部 JS文件？

答：

a、外部 JavaScript文件可以链接到 HTML文档中

b、script标签的 src（源文件）属性可用于包括此外部文件

</script>

14、javascript有何作用？（详细说明）

答：提供用户交互；动态更改内容；数据验证

15、javascript种如何声明定义变量？

答：用弱引用数据类型，var定义声明。如：var a；

16、form中的input有哪些类型？各是做什么处理使用的？

答：text，radio，checkbox，file，button，image，submit，reset，hidden。Submit是button的一个特列，也是button的一种，它把提交这个动作自动集成了。

如果表单在点击提交按钮后需要用JS进行处理（包括输入验证）后再提交的话，通常都必须把submit改成button，即取消其自动提交的行为，否则，将会造成提交两次的效果，对于动态网页来说，也就是对数据库操作两次。

Button具有name、value属性，能触发onclick事件。

Submit继承了button。

Submit增加了触发表单onsubmit事件的功能、增加了执行表单的submit（）方法的功能。

Input type=submit按回车提交表单

Button提交的是innerTEXT。

17、table标签中border，cellpadding td标签中colspan，rowspan分别起什么作用？

答：boder边界；cellpadding边距

Cellpadding，是补白，是指单元格内文字与边框的距离。

Cellspacing，两个单元格之间的距离

Colspan跨列数

Rowspan跨行数

18、form中的input可以设置readonly和disable，请问这两项属性有什么区别？

答：readonly不可编辑，但可以选择和复制

disable不能编辑复制选择

19、JS中的三种弹出式消息提醒（警告窗口、确认窗口、信息输入窗口）的命令是什么？（区别也会问到）

答：alert，confirm，prompt

20、当点击按钮时，如何实现两个td的值互换？

答：用javascript实现此功能。

分析：

这个题主要是考变量传值。其次是考如何取元素的值。

代码如下：

<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""">

<head>

<title>无标题文档</title>

function submitbtn(){

var tText1= document.getElementById('txt1');

var SubmitBtn1= document.getElementById('submitBtn1');

var tText2= document.getElementById('txt2');

var SubmitBtn2= document.getElementById('submitBtn2');

SubmitBtn1.onclick= function(){

var temp= tText1.value;

tText1.value= tText2.value;

tText2.value= temp;

};

SubmitBtn2.onclick= function(){

var temp= tText2.value;

tText2.value= tText1.value;

tText1.value= temp;

};

}

window.onload= function(){

submitbtn();

}

</script>

</head>

<body>

</html>

21、如何给一个Javascript的对象属性赋值？如何取得属性值？

答：一个Javascript对象的属性可以用”.”操作符或者数组方式来设置和取得：代码如下：

obj.name=“IT公司面试手册”;

obj["name"]=“IT公司面试手册”;

取得属性的值：

var myname= obj.name;

var myname= obj["name"];

两种方法的区别是如果属性的名字如果是保留字的话，用点操作符就会报错，代码如下：

obj.for=“IT公司面试手册”；因为for是保留字，所以会报错

obj["for"]=“IT公司面试手册”就不会报错

或者是通过:

//获取用户名对象的name属性的值

var nameVal= document.getElementById("inp1").getAttribute("name");

document.getElementById("inp1").setAttribute("class","ca1");

22、判断文本框内容是不是英文、中文、非中文？

答：

Gb2312

JS代码检查是否是中文：

Function isChinese(s,msg){

Var reg=/[^\u4E00-\u9FA5]/g;

If(reg.test(s.value)){

s.focus();

s.select();

alert(msg?msg:’改栏只能输入中文，请改正！’);

return false;

}

Return true;

}

js代码检查是否是非中文:

function isNoChinese(s,msg){

var reg=/[\u4E00-\u9FA5]|[\uFE30-\uFFA0]/gi;

if(reg.test(s.value)){s.select()

alert((msg?msg:’该栏不能输入中文及全角符号﹐请改正！’));

return false;

}

return true;

}

js代码检查是否是英文字:

function isEnglish(s,msg){

var reg=/^[a-z]*$/gi

if(reg.test(s.value))return true

else{

alert((msg?msg:’该栏目只能输入英文字符﹐请改正’));

s.focus();

s.select();

return false;

}

21、Jquery的基础选择器有哪几种？层次过滤器、内容过滤器、表单过滤器分别列举至少三种？

基础选择器：ID选择器、类选择器、标签选择器

层次过滤器：$(“祖先选择器所有的后代选择器”)

$(“指定的父代对象>对应的直系后代”)

同辈选择器：

$(“A~ B”)：指定与A同辈的同级的B对象

相邻选择器：

$(“A+B”):指定与A相邻的下一个B对象

//内容过滤器：

$(“:empty”):空内容或者不含子元素的对象

$(“A:has(选择器)”)

$(“:contains(文本内容)”)：根据内容来过滤对象

$(“:parent”):获取含有文本内容或者含有子元素的集合对象

//表单选择器

$(“:input”):获取所有表单控件对象

$(“:text”):获取输入类型type=“text”的表单控件

$(“:radio”)：获取单选框的对象

$(“:checkbox”)：获取多选框的对象

$(“:file”):获取上传文件的对象type=’file’

$(“:checked”):获取被选中的单选框或者多选框对象

$(“:selected”)：获取下拉框被选中的对象

等等。。。

22、Jquery对dom对象追加有几种方式？

分别列举？

$(对象).append()

$(对象).appendTo(“要被追加的对象”);

Before()/ after()/prepend()/prependTo()/ html()

23、Jquery的初始化方法有几种？

有三种：

//常用的有两种：

$(function(){})

$(document).ready(function(){})

//第三种：

jQuery(function(){})

//第三种另一种写法：

jQuery(document).ready(function(){})

(注意：Jquery对象的标识符：$等价于 jQuery)

24、Jquery对象获取html元素的内容有哪两种？区别是什么？ Jquery对象如何对表单控件赋值或者获取表单控件的值？

Jquery对象获取元素内容的方法：$(对象).html()/$(对象).text()

Html():可以为选中的Jquery对象设置包含html标签的内容。

Text():只能设置文本内容。

Jquery对象获取表单控件的内容：$(表单控件对象).val();

//赋值：$(表单控件对象).val(赋值);

25、通过js自定义对象，创建一个学生对象，包含姓名、性别、年龄以及学习的方法等，并写入到html页面中。如何使用原型prototype为数组Array对象添加一个构造方法？

//通过原型为Array对象添加一个add方法：

Array.prototype.add= function(参数)

{

函数体操作。

}

26、window对象下，页面跳转的几种方式？

//window对象下的页面跳转方式：

Window.open(“新打开页面的URL”,”_self/_blank/_top”,”规格”);

Window.location.href=””

Window.location.replace(“要替换的页面”);

27、Jquery对象的两种循坏方法？ Js的两种循坏遍历方法分别写案例？

Jquery对象循环的方法：

$(“选择器”).each(function(I,value)

{

});

//循环数组：

$.each(“数组对象”,function(I,value)

{})

//JS循环方法：

//第一种：

For(var i=0;i<对象.length;i++)

{

}

//第二种：

For(var I in数组对象){}

28、如何在html页面上对一个动画元素设置样式？

通过动画过滤选择器来对动画元素设置样式：

$(“div:animated”).css({“”:””,””:””});

:对正在动画的div元素设置样式。

在jQuery里如何使用复合选择器

这次给大家带来在jQuery里如何使用复合选择器，在jQuery里使用复合选择器的注意事项有哪些，下面就是实战案例，一起来看一下。

一介绍

复合选择器将多个选择器（可以是ID选择器、元素选择或是类名选择器）组合在一起，两个选择器之间以逗号“，”分隔，只要符合其中的任何一个筛选条件就会被匹配，返回的是一个集合形式的jQuery包装集，利用jQuery索引器可以取得集合中的jQuery对象。

多种匹配条件的选择器并不是匹配同时满足这几个选择器的匹配条件的元素，而是将每个选择器匹配的元素合并后一起返回。

复合选择器的使用方法如下：

$(" selector1,selector2,selectorN");

selector1：为一个有效的选择器，可以是ID选择器、无素选择器或是类名选择器等。

selector2：为另一个有效的选择器，可以是ID选择器、无素选择器或是类名选择器等。

selectorN：（可选择）为任意多个选择器，可以是ID选择器、无素选择器或是类名选择器等。

例如，要查询文档中的全部的<span>标记和使用css类myClass的<p>标记，可以使用下面的jQuery代码：

$("span,p.myClass");

二应用

在页面添加3种不同元素并统一设置样式。使用复合选择器筛选<p>元素和id属性值为span的元素，并为它们添加新的样式。

三代码

<span class="default" id="span">ID为span的元素</span>

$(document).ready(

function()

{

$("input[type=button]").click(

function()//绑定按钮的单击事件

{

var myClass=$("p,#span");//选取DOM元素

myClass.css("background-color","#C50210");//为选取的DOM元素设置背景颜色

myClass.css("color","#FFF");//为选取的DOM元素设置文字颜色

});

</script>

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！

js选择器 手机版js编辑器

jquery中简单过滤选择器有哪些

js选项卡设计的要点有哪些

在jQuery里如何使用复合选择器

js选择器手机版js编辑器