- 博客(30)
- 收藏
- 关注
原创 删除节点
删除节点的方法,分别是remove(),detach(),empty()方法remove()方法用于从DOM中删除所有匹配元素,remove方法删除某个节点之后,该节点所包含的所有后代节点将>同时被删除。remove()方法的返回值是一个指向已被删除的节点的引用。以>后也可以继续使用这些元素。例如var $p_2 = $(“div p:eq(1)”).remove();//...
2019-10-30 19:43:34 1641
原创 插入节点
插入节点可分为在元素内插入和在元素外插入append(content)为所有匹配的元素内部追加内容appendTo(content)为所有匹配的元素追加(往后)到另一个元素的元素集合中例子如下<body> <div> </div> <script type="text/javascript"> $(documen...
2019-10-30 18:54:32 455
原创 对元素值操作
*val() 获取第一个匹配元素的当前值,返回值可能是一个字符串当select有多个选中值时,则返回一个数组val(val) 用于设置所有匹配元素的值列子:$(“input:text”).val(“新值”)为全部文本框设置内容val(arrVal) 用于为check,select,和radio等元素设置值例子:$(“select”).val([‘列表一’,[‘列表二’]]参...
2019-10-30 18:36:25 151
原创 对元素内容引用
对元素内容引用jquery提供了text()和text(val)两个方法text()用于获取全部匹配元素的文本内容text(val) 用于设置(注入)全部的匹配元素的文本内容html() 用于获取第一个匹配元素的HTML内容html(val) ----用于设置全部的匹配元素的文本内容注意:html()方法与html(val)不能用于XML文档,但是可以用于XHTML文档&l...
2019-10-30 18:28:17 199
原创 过滤选择器
过滤选择器简单过滤器简单过滤器是以冒号开头,通常用于实现简单效果的过滤器。例如,匹配找到的第一个元素等下表:first$(“tr:first”)匹配表格的第一行:last$(“tr:last”)匹配表格的最后一行:even$(“tr:even”)匹配索引值为偶数的行:eq(index)$(“div:eq(1)”)匹配第二个div元素:odd...
2019-10-27 21:40:31 93
原创 隔行换色鼠标指向表格换色
<script language="JavaScript" src="jquery-3.4.1.min.js"></script> <title>隔行换色鼠标指向表格换色</title> </head> <body> <table> <thead> <tr> ...
2019-10-27 20:40:24 288 1
原创 表单对象的属性过滤器
<body><form> 复选框1:<input type="checkbox" checked="checked" value="复选框1" /> 复选框2:<input type="checkbox" checked="checked" value="复选框2" /> 复选框3:<input type="button" ...
2019-10-27 19:48:18 145
原创 可见性过滤器
<script language="JavaScript" src="jquery-3.4.1.min.js"></script> <title>可见性过滤器</title> </head> <body> <input type="text" value="显示的input元素" /> <in...
2019-10-27 19:46:50 101
原创 内容过滤器
<script language="JavaScript" src="jquery-3.4.1.min.js"></script> <title>内容过滤器</title> </head> <body> <table width="98%" border="0" align="center" cellpadd...
2019-10-27 19:45:43 113
原创 简单过滤选择器
<script language="JavaScript" src="jquery-3.4.1.min.js"></script> <title>简单过滤选择器</title> </head> <body> <table width="98%" border="0" align="center" cellpa...
2019-10-27 19:43:12 108
原创 层次选择器
层次选择器ancestor descendant 选择器parent>child选择器prev+next选择器prev~siblings选择器ancestor descendant 选择器ancestor descendant选择器中ancestor表示祖先descendant表示孙子,用于给祖先元素下匹配所有的后代元素使用方法如下$(“ancestor descend...
2019-10-27 19:40:44 331
原创 基本选择器
## 基本选择器 jQuery基本选择器包括 1. ID选择器 2. 元素选择器 3.类名选择器 4.多种匹配条件选择器 5.通配符选择器 ID选择器 ID选择器的使用方法: jQuery中的ID选择器相当于传统的JavaScript中的document.getElementById() 1. $("#id") id为要查询元素ID属性值,例如,...
2019-10-27 19:13:19 182
原创 jquery对象和DOM对象的转换
<script language="JavaScript" src="jquery-3.4.1.min.js"></script> <title>jquery对象和DOM对象的转换</title> </head> <body> <script type="text/javascript"> ...
2019-10-23 18:16:23 66
原创 jQuery对象和DOM对象的对比
jQuery简介jQuery是一套简洁,快速,灵活的JavaScript脚本,它是由JOhnResing于2006年创建的,他帮助人们简化了javascript代码。由于jQuery简易易用,文档十分丰富,已被大量的开发人员推崇。jQuery对象和DOM对象 1.DOM对象 DOM对象是document Object Model,即文档对象模型的缩写。DOM是以层 次结构组织的节点...
2019-10-23 18:06:34 82
原创 jquery对象和DOM对象的转换
<script type="text/javascript"> var $mr = $("#mr");//jquery对象 var mr = $mr[0]; //DOM 对象 alert("远上寒山石径斜");//获取DOM 元素的对象value并输出 //jQuery对象本身也提供get(index)方法,可以得到相应的DOM对象 var $s...
2019-10-23 17:31:53 122
原创 类名选择器 .class
<script type="text/javascript" src="jquery-3.4.1.min.js"></script> <body> <!-- 类名选择器是通过元素拥有的css类的名称查找匹配的dom元素 使用方法 $(".class") class为要查询元素所用的css类名,例如:使用css类名为word_orange的...
2019-10-23 10:32:10 420
原创 元素选择器element
<script type="text/jscript" src="jquery-3.4.1.min.js"></script> <body> <!-- 元素选择器的使用方法 元素选择器是根据元素名称匹配相应的元素 多数情况下,元素选择器匹配的是一组元素 &("element") 其中element 是获取元素的标记名 ...
2019-10-23 10:31:02 535
原创 ID选择器 id
<script type="text/javascript" src="jquery-3.4.1.min.js"></script> <body> <!--//ID选择器的使用方法: //jQuery中的ID选择器相当于传统的JavaScript中的document.getElementById() //1. $("#id") id...
2019-10-23 10:29:46 140
原创 获取正则对象
<script> // 模式符 说明 // g 用于目标字符串中实现全局匹配 // i 忽略大小写 // m 实现多行匹配 // u 以Unicode编码执行正则表达式 // y 粘性匹配,仅匹配目标字符串中此正则表达式的lastIndex属性指示的索引 var str ='^abc\\1.23*edf$'; var ...
2019-10-20 16:22:17 160
原创 如何使用正则
<script> var str ='AbC12345'; var reg= /abc/i;// '/'表示正则表达式的定界符 i忽略大小写 reg.exec(str); console.log(reg.exec(reg)); //exec()方法的参数是待匹配的字符串 //str 匹配成功时,该方法的返回值是一个数组,否则返回null var str...
2019-10-20 16:21:12 93
原创 跳转语句
<script> outerloop: //跳出外部循环 for(var i=0;i<10;++i){ for(var j=0;j<1;j++){ if(i== 3){ break outerloop; } console.log('i='+i+'j=' +j); } } </scr...
2019-10-20 16:19:40 94
原创 获取圆的周长和面积
<title>计算圆的周长和面积</title> </head> <body> <div> <p>圆的半径:<input id ="r" type="text".></p> <p>圆的周长:<input id="d" type="text" ></p&...
2019-10-20 16:14:21 394
原创 金字塔
<title>金字塔</title> </head> <body> <script> var c = prompt('请设置金字塔的层数'); c = parseFloat(c) && Number(c); if(isNaN(c)){ alert('请输入纯数字'); } fo...
2019-10-20 16:12:33 75
原创 九九乘法表
<title>九九乘法表</title> </head><!--规律:九九乘法表的层数=表格的行数 =每列中的列数--> <body> <div id="table"></div> <script> var str = '<table>'; for(var i=1;i...
2019-10-20 16:11:20 92
原创 鼠标拖拽特效
<title>鼠标拖拽事件</title> </head> <body> <div id="box" class="box"> <div id="drop" class="hd">注册信息(可以拖拽) <span id="box_close">【关闭】</span> </...
2019-10-13 13:52:30 193
原创 焦点事件
<title>焦点事件</title> </head> <body><div id="tips"></div><div class="box"> <label>用户名:<input id="user" type="text"></label><br> &l...
2019-10-13 13:29:45 115
原创 缓动的小球
<title>缓动的小球</title> <style> #box{position:absolute;width:120px;height:120px;line-height:120px;text-align:center;background:red;color:#fff;border-radius:60px;} </sty...
2019-10-13 13:04:43 106
原创 数据类型转换
script> //转布尔类型 var con =prompt(); if(Boolean('null')){ //Boolean() 函数对用户输入的内容进行布尔类型转换 //Boolean() 函数会将任何非空字符串和非零的数值转换为true,将空字符串,0,NaN,undefined和null转换为false document.write('为输入内容'); }els...
2019-10-11 19:20:22 51
原创 变量
标识符 定义标识符的原则1.有大小写字母,数字,下划线,和美元符号($)组成,如str,arr3,get-name,$name.2.不能以数字开头,如56name非法标识符3.严格区分大小写,如it与IT表示不同的标识符4.不能使用JavaScript中的关键字命名,如var作为变量是不合法的5.要尽量做到“见其名,知其意” ...
2019-10-10 20:42:55 76
原创 改变网页背景颜色
function color(str){ //color()函数用于改变网页背景颜色 //str 表示传入的颜色值document.body.style.backgroundColor = str;//第8行 改变document.body元素的style对象中的backgroundColor属性}//style表示传入的样式//backgroundColor表示css中...
2019-10-10 20:08:37 818
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人