zoukankan      html  css  js  c++  java
  • js操作BOM

    四种打开窗口方式

            //window.open(url, target);
    		//window.close();
    
    		//在当前窗口打开,可后退
    		//原理:自动使用当前窗口的name
    		HTML:<a href="url" target="_self"></a>
    		js:open(url, '_self');
    
    		//在当前窗口打开,禁止后退
    		//原理:用新url替换当前history中的url
    		js:location.replace(新url);
    
    		//在新窗口打开,可打开多个
    		//原理:不指定窗口名,每打开一个窗口,浏览器会自动随机生成内部窗口名
    		HTML:<a href="url" target="_blank"></a>
    		js:open(url, '_blank');
    
    		//在新窗口打开,只能打开一个
    		//原理:自定义窗口名,这个名字在内存中只能出现一次,一个名字对应一个窗口,后来打开的会覆盖先打开的窗口
    		HTML:<a href="url" target="自定义窗口名"></a>
    		js:open(url, '自定义窗口名');
    

    history三种操作:前进、后退、刷新

    		//前进:history.go(1);
    		//后退:history.go(-1);history.go(-2);
    		//刷新:history.go(0);
    

    location

    		//location属性
    		//.href:获取或设置完整的url地址
    		//.protocol:协议
    		//.host:主机名+端口号
    		//.hostname:主机名
    		//.port:端口号
    		//.pathname:相对路径
    		//.search:查询字符串参数
    		//.hash:锚点地址
    
    		//location方法
    		//在当前窗口打开,可后退
    			//location = url;
    		//在当前窗口打开,禁止后退
    			//location.replace(新url);
    		//刷新
    			//优先从缓存中获取资源,若缓存中没有或过期,才从服务器获取资源
    			//F5
    			//history.go(0);
    			//location.reload();
    
    			//无论缓存中有没有资源,都强制从服务器获取资源
    			//location.reload(true);
    

    定时器

    			//周期性定时器
    				//1.定义任务函数:变化一次的函数
    				//function task(){...}
    				//2.将任务函数放入定时器中反复执行
    				//等待相应的ms数后,开始调用task,依次循环执行
    				//let timer = setInterval(task, ms);
    				//timer为当前定时器唯一的序号,专门用于停止定时器
    				//3.停止定时器
    				//clearInterval(timer);timer = null;
    					//3.1定时器自动停止
    					//在task中设置临界值,达到临界值,停止定时器
    					//3.1手动停止定时器
    					//通过触发事件,停止定时器
    
    			//一次性定时器
    				//let timer = setTimeout(task, ms);
    				//clearTimeout(timer);
    				//在task执行前,停止等待,不再执行任务
    

                //1.判断是否启用cookie
    				let bool = navigator.cookieEnabled;
    				cookie是客户端持久存储用户私密信息的小文件
    			//2.判断是否安装插件
    				navigator.plugins['插件名'] !== undefined
    			//3.判断当前浏览器名称和版本号
    				navigator.userAgent
    

    event

    			概念:用户手动触发的、或浏览器自动触发的页面状态的改变
    
    			绑定事件处理函数:
    			1.在HTML中绑定事件处理函数(几乎废掉,不符合内容与行为分离的原则)
    				<ANY ...on 事件名="js语句"...>
    			2.在js中,用赋值方式绑定
    				ANY.on 事件名=function(){
    					this->ANY 当前触发事件的.前的元素
    				}
    				赋值是替换原函数,每个事件只能绑定一个处理函数
    			3.在js中,为元素添加事件监听对象
    				ANY.addEventListener('事件名', handler)
    				一个事件,可同时添加多个处理函数,可随时添加和移除
    				ANY.removeEventListener('事件名', 原handler)
    				如果一个处理函数可能被移除,则绑定时,就必须用有名的函数,不能用匿名函数
    
    		事件模型
    			当事件发生时,浏览器触发事件的过程
    			DOM标准认为,点在内层元素上,也等效于点在外层元素上了
    			3个阶段:
    				1.由外向内捕获各级父元素绑定的处理函数
    					捕获阶段,只记录处理函数,不执行
    				2.目标触发
    					目标触发,最初实际触发事件的元素
    					优先触发目标元素上的处理函数
    				3.冒泡
    					由内向外,按捕获阶段顺序的反向,依次触发父元素上的处理函数
    
    		事件对象:e
    			事件发生时,自动创建的记录事件信息的对象
    				创建:自动创建
    				获取:事件对象e总是作为处理函数的第一个参数,自动传入
    			取消冒泡:
    				e.stopPropagation()
                利用冒泡:
    				只要多个平级子元素,要绑定相同事件时
    				只要在父元素上绑定一次处理函数,所有子元素自动共用
    				难点:
    					1.获取目标元素
    						错误:this->父元素
    						正确:e.target->记录了最初触发事件的函数,且不随冒泡而改变
    					2.鉴别e.target是否是想要的
    			阻值默认事件行为:
    				e.preventDefault()
    				1.<a href="#xxx"
    					默认:跳到锚点,在url结尾增加#xxx
    				2.阻止表单自动提交
    					自定义表单提交:
    						1.<input type="button" js:form.submit()
    						2.<input type="submit"
    							=>form.onsubmit():e.preventDefault()
    				3.HTML5中做拖拽效果时,必须阻止浏览器默认的拖拽行为
    
  • 相关阅读:
    SqlServer 查看被锁的表和解除被锁的表
    Windows Server 2012 R2 或 2016 无法安装 .Net 3.5.1
    请求文件下载URL过长处理
    T4语法
    windows下 安装 rabbitMQ 及操作常用命令
    ubuntu系统启动qtceator时提示:Qt5.5.1/Tools/QtCreator/lib/qtcreator/plugins/libHelp.so: 无法加载库
    升级到VS2013常见问题
    Windowns 无法启动 Office Software Protection Platform 服务,系统找不到指定的文件
    SVN clean失败解决方法
    使用PostSharp在.NET平台上实现AOP
  • 原文地址:https://www.cnblogs.com/debug/p/11261354.html
Copyright © 2011-2022 走看看