JS-Dom-Jquery
关注
分享
扫一扫
天赋进行时
狗狗狗
展开
-
Cookie的基础概念
Cookie是保存在浏览器上的内容,用户在浏览页面的时候就可以取出来上次保存的内容.这样就可以得到上次记忆的内容. Cookie不是jquery特有的概念.只是jquerycookie把它简化更加好用简单来说:cookie是保存在浏览器里的一些数据cookie需要浏览器的支持.浏览器的cookie是可以禁止的.如果禁用cookie就不能使用.一般情况下.不考虑禁用cookie的情况.cookie是原创 2016-02-28 21:40:44 · 350 阅读 · 0 评论 -
jQuery12(prev练习,相对元素)
prev练习题目:评分 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>原创 2016-02-06 00:12:46 · 430 阅读 · 1 评论 -
jQuery11(过滤器的3个练习)
过滤器练习1题目:点击按钮变色,改变字体大小.实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>原创 2016-02-06 00:07:30 · 448 阅读 · 0 评论 -
jQuery10(过滤器)
过滤器关键词:first 语法实例:$('ul li:first').css('backgroundColor','yellow'); 意义:ul标签中的第一个元素关键词:last 语法实例:$('ul li:last').css('backgroundColor','yellow'); 意义:ul标签中的最后一个元素关键词:even 语法实例:$('ul li:even').css('b原创 2016-02-05 23:58:24 · 335 阅读 · 0 评论 -
jQuery9(操作类选择器,开关灯)
类选择器的添加及移除添加类选择器 关键字:addClass() 语法:$(‘#p1’).addClass(‘cls’); 意义:给id为p1的元素添加类 cls移除类选择器 关键字:removeClass() 语法:$(‘#p1’).removeClass(‘cls’); 意义:为id为p1的元素移除类名为cls的类.注意,如果这里不写.则移除该元素所有的类样式!!!实例:<!DOCTY原创 2016-02-05 23:48:58 · 712 阅读 · 1 评论 -
jQuery8(常见方法next.prev等,常见方法练习)
常见的方法关键字:nextAll() 语法示例:$('div').nextAll().css('backgroundColor','red'); 意义:层后面的所有的元素关键字:next() 语法实例:$('div').next().css('backgroundColor','red'); 意义:层后面的第一个元素关键字:prev() 语法实例:$('div').prev().css(原创 2016-02-05 23:33:54 · 529 阅读 · 0 评论 -
jQuery7(多条件选择器,层次选择器)
多条件选择器关键点:当使用$('') ,引号内的内容可以写多个. 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"原创 2016-02-05 23:20:17 · 654 阅读 · 0 评论 -
jQuery6(获取元素练习,改变标签样式及内容)
获取元素练习-我们都是p标签知识点:jQuery是隐式迭代.不需要for循环.text对应的是dom中的innerText. 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=原创 2016-02-05 23:00:28 · 474 阅读 · 0 评论 -
jQuery4(3种选择器,选择器获取元素)
该内容所将选择器都是出现在style中;id选择器实例: #dv //id选择器 { width:300px; height:200px; background-color:Gray; }知识点::将id为dv的标签设置为该样式标签选择器实例:div { width:300px; height:200p原创 2016-02-05 22:52:47 · 1035 阅读 · 0 评论 -
jQuery4(Dom与jQuery对象的相互转换)
Dom与JQuery对象的相互转换关键字:get[0],[0] Dom转换为JQuery:$(document.getElementById('dv'));jQuery转换为Dom:$(document.getElementById('dv'))[0];$(document.getElementById('dv')).get[0];实例:<!DOCTYPE html PUBLIC "-//W3C原创 2016-02-05 22:41:54 · 279 阅读 · 0 评论 -
jQuery13(相对元素的练习)
相对元素的练习关键词:this 语法:$('td:odd',$(this)).css('backgroundColor','yellow'); 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><h原创 2016-02-06 00:16:54 · 301 阅读 · 0 评论 -
jQuery14(表单过滤器及注意事项)
表单的过滤器获取层中有id属性值的层,里面的参数可以多写$('div[id]').css('backgroundColor', 'red');获取层中id值为dv1的层$('div[id=dv1]').css('backgroundColor', 'red');获取层中id值不为dv1的层$('div[id!=dv1]').css('backgroundColor', 'red');获取div中id原创 2016-02-06 20:58:45 · 474 阅读 · 0 评论 -
jQuery23(获取radiobuttomvalue及选中)
获取被选中的单选按钮的value值注意点:radio,check无法直接遍历,需要使用each方式进行遍历 实例:$(':radio:checked').each(function (index, ele) { alert($(ele).val()); });radiobuttom的选中的特殊写法$('#btnchecked'原创 2016-02-07 00:34:21 · 402 阅读 · 0 评论 -
jQuery22(替换元素,包裹元素)
替换元素第一种方式: 原节点.replaceWith(新节点). 实例:$('br').replaceWith('<hr color="red" />')第二种: 新节点.replaceAll(原节点) 实例: $('<hr color="red" />').replaceAll('br')完整实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 T原创 2016-02-07 00:28:47 · 1161 阅读 · 0 评论 -
jQuery21(文本框为空,球队)
文本框为空练习完整实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></tit原创 2016-02-07 00:21:21 · 381 阅读 · 0 评论 -
jQuery20(加号计算机,判断按钮是否可用)
加号计算机注意点:要使用parseInt转换value值,另外,使用val(值)的方式,将指定的value值显示. 完整实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="ht原创 2016-02-07 00:18:45 · 418 阅读 · 0 评论 -
jQuery19(无刷新评论,清空元素)
无刷新评论(动态添加)完整实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title><原创 2016-02-07 00:12:30 · 313 阅读 · 0 评论 -
jQuery18(小广告效果,动态创建表格)
小广告效果知识点:bottom是末端的意思.另外,因为直接在这里写html,所以,小心一些在html和js中不同的写法. 完整实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=原创 2016-02-07 00:09:13 · 363 阅读 · 0 评论 -
jQuery17(html,attr,removeAttr,动态创建元素)
html,attr,removeAttr方法html方法对应的是Dom中的innerHtml方法,text对应的是Dom中的innerText方法. html方法: 实例:$('div').html('<font color="red">哈哈</font>');注意,如果html中不写的话表明是获取.attr方法: 一般写两个值,属性及属性值.注意.如果是要写true,false.例如attr原创 2016-02-07 00:00:59 · 560 阅读 · 0 评论 -
jQuery16(内容过滤器,子元素过滤器)
内容过滤器表示所有层内包含哈哈内容的层,注意,fontSize S大写$('div:contains(哈哈)').css('fontSize', '50px');空的层,注意,实例ie11及谷歌无效$('div:empty').text('我也不为空啦');所有层中包含a标签的$('div:has(a)').css('backgroundColor', 'red');父亲元素$('div:paren原创 2016-02-06 23:44:36 · 340 阅读 · 0 评论 -
jQuery15(元素each方法,表单选择器)
元素的each方法目前已知,radio,checkbox在jQuery中无法直接遍历,需要使用each方法进行遍历. 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="htt原创 2016-02-06 21:58:44 · 560 阅读 · 0 评论 -
JQuery3(map,each,trim方法)
方法:map用法:遍历数组等 语法:$.map(arr,function(ele,index){});实例:<script type="text/javascript"> var arr = [1, 2, 3, 4, 5, 6, 7]; // $.map(arr, function (ele, index) { //原创 2016-02-05 22:19:50 · 515 阅读 · 0 评论 -
jQuery2(JQuery实现onload)
JQuery实现onload注意:dom中的onload,是全部资源加载完后在进行执行,且只能执行一个.而jQuery中是基础元素加载完后就执行,且能执行多个(效率高). 语法:$(function(){});完整的实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm原创 2016-02-05 22:09:04 · 1041 阅读 · 0 评论 -
Dom7(动态创建标签,获取页面元素)
动态创建标签关键字:wirite 语法:document.write(‘内容’); 注意:该方法可以动态创建标签,里面的内容可以直接写标签语句.可以用作镶嵌广告,如果在页面加载后执行,那么页面的其他标签都将会小时. 实例: <script type="text/javascript"> onload=function(){ //第一个作用,可以动态创建标签原创 2016-01-25 10:18:13 · 2135 阅读 · 0 评论 -
Dom6(复制粘贴事件及剪切板操作)
复制事件关键词:oncopy 在复制时触发,可以使用return false去除. 实例:<script type='text/javascript'> //复制的事件 onload=function(){ document.getElementById('bd').oncopy = function () { alert('禁止复制');原创 2016-01-25 09:23:33 · 1480 阅读 · 0 评论 -
Dom5(取消默认事件,获取分辨率,获取鼠标按钮)
超链接显示时间主要使用的语法:retrun false 什么也不执行,取消默认事件 (event.returnValue=false) 这种方式不推荐使用,考虑到兼容性问题. 当前时间:new Date().toLocaleTimeString()locale:场所,现场 实例:<!doctype html><html lang="en"> <head> <meta charset=原创 2016-01-21 16:31:20 · 400 阅读 · 0 评论 -
Dom4(重定向,文本框自增,判断按键)
重定向到指定网站: 语法:location.href=’需要跳转的网址’.<!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Key原创 2016-01-21 16:14:59 · 327 阅读 · 0 评论 -
Dom3(clientX.Y.动态注册事件.弹窗)
clientX与clientY 这是event的两个属性,所以需要考虑兼容性问题.在测验当中,ie和谷歌均能识别,火狐无法识别event参数. 案例是一种兼容性的写法,可以参考onload=function(){document.getElementById('dv').onmousemove=function(){if(arguments.length==0){//等于0为ie,谷歌do原创 2016-01-21 15:59:27 · 325 阅读 · 0 评论 -
Dom2(页面加载事件,标签样式,刷新)
主要有3种: 第一种:onload 页面加载完毕时触发,浏览器是一边下载文档,一边解析执行,可能会出现会出现JavaScript执行时需要操作的参数还没有加载.如果这样,就要把操作的文档放到body的onload事件中,或者把JavaScript放到元素之后.元素的onload事件是元素自己加载完毕时触发,body onload才是全部加载完成. 案例:onload=function(){原创 2016-01-21 15:29:10 · 687 阅读 · 1 评论 -
Dom1(doc范围,计时器)
明确Document的范围 页面上所有的范围都是Document Body范围指的是body标签内标签的内容控件如果两个重叠的话则会有事件冒泡.出现Body弹窗,在出现Document弹窗.案例如下<!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="原创 2016-01-21 14:13:59 · 311 阅读 · 0 评论 -
JavaScript基础
JavaScript是一种在浏览器端执行的脚本语言,和Java没有直接的关系,是一种解释性语言,无需编译就可以随时运行,是一种脚本语言,里面所有的变量都是var弱变量. JavaScript可以跨平台,只要有一个支持JS的就行.推荐使用高级记事本开发,避免出现很多错误.JS是一种非常灵活的动态语言,不同于c#等静态语言哪样严谨,开发工具的JS完成功能只是一个辅助功能. .出来的成员调用可能可以使用原创 2016-01-11 13:12:32 · 249 阅读 · 0 评论 -
Html基础
Html作用:展示信息,相当于人(无衣服) Css作用:美化页面,相当于衣服 JavaScript:简称JS,脚本,包含Dom,Jquery浏览器:解释和执行Html源码的工具静态页面:简单说后缀名是Html,Htm.H标签(标题) Html定义了h1-h6 6个h标签,分别表示不同大小的字体.H1最大,H6最小.<br/>只是回车,<p>是分段,前后会有较大的空白,而<br/>则没有.<ce原创 2016-01-11 11:15:38 · 383 阅读 · 0 评论 -
Dom8(获取元素及计时器练习)
获取元素练习难点:注意在修改之前先将全部内容复位. 实例:<!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" c原创 2016-01-25 10:23:29 · 376 阅读 · 0 评论 -
Dom9(美女时钟)
所用知识点:建立时间对象. var date=new Date();获取小时 var hour=date.getHours();获取分钟 var minu=date.getMinutes();获取秒 var sec=date=getSeconds();设置图片src属性: 实例:<!doctype html><html lang="en"> <head> <原创 2016-01-25 10:29:17 · 941 阅读 · 0 评论 -
jQuery1(jQuery介绍及$)
jQuery介绍jQuery是一个JavaScript的框架库.因为普通JavaScript缺点很明显:每种控件的操作方式不统一,不同浏览器下有区别.要编写浏览器程序非常麻烦. 优点:对JavaScript进行了封装简化了开发解决大部分的兼容性问题对不同的控件具有统一的操作方式体积小,简单方便链式编程,隐式迭代免费jQuery文件组成: jQuery普通文件,带mini的为压缩版,原创 2016-02-05 22:00:46 · 319 阅读 · 0 评论 -
Dom15(让图片飞)
让图片飞关键字:onmouseover 翻译:鼠标移到目标上时 目的:让图片跟着鼠标移动 思路:设置document的onmouseover事件,注意是document.因为dom范围比较大.并且设置图片的位置属性,使其脱离文档流. 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3原创 2016-02-05 21:51:55 · 260 阅读 · 0 评论 -
JavaScript2
JS中的闭包概念 闭包:嵌套的方法,外面的方法中定义了一个变量,里面的方法可以访问该变量. 注意的点:没事不要写闭包,闭包可以模拟面向对象.闭包通过作用域来实现,从最里面开始向外面衍生.先找到哪个就用哪个JS中的数组 关键字:Array 用途:数组中可以存储任意类型的变量,且长度即使指定数组长度也无效. 数组中也可以存储键值对创建数组的方式: var arr=[1,2,3,4,5,原创 2016-01-13 22:33:39 · 404 阅读 · 0 评论 -
Doc15(层的显示和隐藏及超链接显示图片)
层的显示和隐藏关键词:display 翻译:显示 思路:通过设置层的style下的display属性,改变层的显示效果 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="原创 2016-01-28 15:09:24 · 309 阅读 · 0 评论 -
Doc14(表格单数行变色及点击变色)
点击按钮表格单数行变色练习语法:对象.style.backgroundColor=’颜色’; 注意点:在html中有-的单词在js中去掉-且后面首字母大写,例如上面的backgroundColor.另外颜色需要单引号引起来 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR原创 2016-01-28 15:06:37 · 486 阅读 · 0 评论 -
Doc13(样式浮动及文本框空就变色)
样式浮动关键字:styleFloat,cssFloat Float,翻译为浮动 styleFloat是在IE等浏览器中的写法,cssFloat是在火狐浏览中的写法 兼容性写法同样要使用能力检测(类型检测).语法:document.getElementById(‘dv’).style.styleFloat=’参数’;实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XH原创 2016-01-28 15:04:15 · 278 阅读 · 0 评论