![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端Javascript相关操作说明
文章平均质量分 71
午夜玫瑰钻
前端开发爱好者
展开
-
Javascript查找字符串中的某个值,截取其之前。和之后的值
1、例如截取xxx.txt 点后面和前面的值var str1 = "xxxaaa.txt"; var str2 = "xxxbbb.txt"; var str3 = "xxxccc.txt"; document.write(str1.split(':')[0]) //输出xxxaaadocument.write(str1.split(':')[1]) //输出txt原创 2020-12-15 21:24:26 · 1464 阅读 · 0 评论 -
Ajax从服务器端获取数据
例子1.XML数据user.xmlxml version="1.0" encoding="utf-8" ?>users> user> username>张三XMLusername> age>33age> user> user> username>李四XMLusername> age>34age> user>users>原创 2016-01-08 14:24:35 · 1055 阅读 · 0 评论 -
基于jquery实现的类似百度搜索的输入框自动完成功能
废话不多说,直观的看一下: 实现这个功能需要服务端配合。客户端通过脚本来展示从服务端取得的数据。 先看客户端的HTML:代码如下: "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 搜索词自动完成 #search{ text-align原创 2016-01-08 00:54:56 · 335 阅读 · 0 评论 -
Ajax学习心得
自己以前一直对Ajax的认识不是很清楚,感觉这一块内容还是比较难以理解的,但是当自己在学习了一段时间java web中心看Ajax,自己对这一块的技术有了新的认识。简单来说就是http中的一个reques和一个response对象。 首先ajax不是一门边长语言,而是一种技术而且,因为这种技术和平常人民理解的前端技术有所差异,和后台数据内容交互操作。 一 .XMLHttpR原创 2016-01-06 22:54:24 · 631 阅读 · 0 评论 -
JavaScript unescape() 函数详解
unescape()函数用于对已经使用escape()函数编码的字符串进行解码,并返回解码后的字符串。该函数属于Global对象,所有主流浏览器均支持该函数。但目前已不推荐使用该函数,尤其是不能用来对URI进行解码。语法unescape()函数已过时,请使用decodeURI()或decodeURIComponent()函数替代该函数。unescape()函数的语法原创 2016-01-06 20:48:19 · 1531 阅读 · 0 评论 -
JavaScript escape() 函数详解
escape()函数用于对字符串进行编码,并返回一个可在所有计算机上读取的编码字符串。该函数属于Global对象,所有主流浏览器均支持该函数。但目前已不推荐使用该函数,尤其是不能用来对URI进行编码。语法escape()函数已过时,请使用encodeURI()或encodeURIComponent()函数替代该函数。escape()函数的语法如下:escape(原创 2016-01-06 20:43:37 · 2951 阅读 · 0 评论 -
Javascript中 cookie的操作和详解
什么是Cookie?解释:cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。cookie 是访问过的网站创建的文件,用于存储浏览信息,例如个人资料信息在JavaScript中可以通过document.cookie 来读取或设置这些信息。由于原创 2016-01-06 20:13:03 · 288 阅读 · 0 评论 -
用js实现同一页面多个不同运动效果
要点一//查询某个对象的某个属性值function getStyle(obj,attr){if(obj.currentStyle){return obj.currentStyle[attr];}else{return getComputedStyle(obj,false)[attr];}}要点二//在此操作想要获取对象的属性var divs原创 2015-12-21 20:42:51 · 512 阅读 · 0 评论 -
用js实现同一页面多个不同运动效果2
要点一:function getstyle(obj,name){if(obj.currentStyle){return obj.currentStyle[name];}else{return getComputedStyle(obj,false)[name];}}从样式表中根据id和属性名取值。要点二:if(attr == "opacity"){cur原创 2015-12-21 20:51:52 · 468 阅读 · 0 评论 -
滚动广告效果
body,div,span{margin:0;padding: 0}#div1{width: 100px;height: 100px;background: red;position: absolute;right: 3px;} var div = document.getElementById('div1');//先让div居中显示原创 2015-12-21 12:53:58 · 400 阅读 · 0 评论 -
Javascript仿京东放大镜的效果
随便找一个图片吧。小伙伴们,想怎么玩就怎么玩(注意路径),亲自测试,绝对没问题。body,div{margin: 0; padding: 0;}#zhuti{ margin:50px;position: relative;}#small{width: 300px;height: 187px;border: 1px solid #000;原创 2015-12-21 10:47:12 · 488 阅读 · 0 评论 -
一个纯js的ajax
/** * 得到ajax对象 */functiongetajaxHttp() { varxmlHttp; try{ // Firefox, Opera 8.0+, Safari xmlHttp = newXMLHttpRequest();原创 2016-01-08 15:38:14 · 353 阅读 · 0 评论 -
jQuery Ajax通用js封装
第一步:引入jQuery库/resources/js/jquery.min.js">第二步:开发Ajax封装类,已测试通过,可以直接调用,直接贴代码,讲解就省了/***************************************************************** jQuery Ajax封装通用类 (原创 2016-01-08 15:45:30 · 309 阅读 · 0 评论 -
利用浏览器的 window.print();打印分层表格【强制换页的关键】
<!--_meta 作为公共模版分离出去--><!DOCTYPE HTML><html><head><meta charset="utf-8"><meta name="renderer" content="webkit|ie-comp|ie-stand"><meta http-equiv="X-UA-Com...原创 2019-08-14 15:59:27 · 1285 阅读 · 0 评论 -
使用插件jquery.PrintArea.js,打印样式信息的解决办法
使用jquery.PrintArea.js打印局部网页样式的时候,发现样式打印不出来解决办法如下一、看css的引用文件方式 1、直接在内部的元素中使用”style”属性来定义样式,比如:<div style=”width:800px;”></div> 2、在<head>元素中使用”style”元素来指定 3、使用<link>...原创 2019-08-05 16:08:33 · 7364 阅读 · 0 评论 -
jquery获取键盘的事件
一、键盘事件1、keypress()事件keypress 当按钮被按下时,会发生该事件,我们可以理解为按下并抬起同一个按键。2、keydown()事件当按钮被按下时,发生 keydown 事件。3、keyup事件keyup 事件会在按键释放时触发,也就是你按下键盘起来后的事件二、通过键盘事件可以进行相应操作 //键盘操作var docu = docume...原创 2018-09-19 10:45:17 · 720 阅读 · 0 评论 -
js判断input中是否有值问题
js判断input中是否有值问题ABvar inputA = document.getElementById('inputAId');var inputB = document.getElementById('inputBId');function getA(){if(inputA.value != ''){ alert('提交InputA原创 2017-11-03 23:15:03 · 10959 阅读 · 1 评论 -
原生JS对文本框值的判断
JS对文本框值的判断JS判断只能是数字和小数点(摘录自其它资料,在此发表只为个人以后使用查找方便)1.文本框只能输入数字(不包括小数点)2.只能输入数字和小数点.3.数字和小数点方法二<input type=text t_value="" o_value="" onkeypress="if(!this.value.match(/^[\+\-]?\d*?\.?\d转载 2017-11-03 22:58:30 · 905 阅读 · 0 评论 -
移动端和PC端 H5开发 整理资料
移动h5开发逐渐成为一种主流,也不断趋向于成熟。硬件和浏览器的不断更新,曾经的浏览器兼容也不再是开发者的噩梦。接触h5开发一年多,从最初的新手到现在,陆陆续续遇到过很多坑。这里把想到的一些经验与资源罗列出来,给刚入h5的同学带来一些帮助。基础知识新手建议看看下面的在线教程。html,css,JavaScript,jQuery在线教程:w3school转载 2017-02-27 10:53:01 · 6249 阅读 · 0 评论 -
JS截取字符串常用方法详细整理
截取字符串的使用比较广泛,有很多中方法,本文粗略的整理了一些,感兴趣的额朋友可以才参考下使用 substring()或者slice() 函数:split() 功能:使用一个指定的分隔符把一个字符串分割存储到数组 例子: str=”jpg|bmp|gif|ico|png”; arr=theString.split(”|”); //arr是一个包含字原创 2016-01-13 22:05:40 · 279 阅读 · 0 评论 -
js中substr,substring,indexOf,lastIndexOf,split 的用法
js中substr,substring,indexOf,lastIndexOf,split等的用法 1.substrsubstr(start,length)表示从start位置开始,截取length长度的字符串。var src="images/off_1.png";alert(src.substr(7,3));弹出值为:off 2.sub原创 2016-01-13 22:03:17 · 309 阅读 · 0 评论 -
document.body.scrollTop用法
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offsetWidth (包括边线的宽);网页可见区域高: document.body.offsetHeight (包括边线的宽);网页正文全文宽: document.body.scro原创 2016-01-10 22:06:24 · 578 阅读 · 0 评论 -
Javascript图片轮播效果
注意:图片的路径和图片的名字要改成1.jpg/2.jpg/3.jpg等格式,根据数组下标进行查询,亲测有效body,div,ul,li,img{margin: 0px;padding: 0px;}#menu{width: 496px;margin: auto;}#head{border: 1px solid blue;}#he原创 2015-12-21 10:49:36 · 408 阅读 · 0 评论 -
一个打蜜蜂的小游戏demo的代码
前沿介绍: this.map.offsetWidth 代表地图本身的宽度this.oUl.offsetWidth 代表蜜蜂ul的宽度this.oUl.style.left 代表小蜜蜂距离左边的位置this.oA.style.left = (this.map.offsetWidth - this.oA.offsetWidth)/2 + 'px'; //自己飞机距离左边的原创 2016-01-05 17:20:52 · 1064 阅读 · 0 评论 -
Javascript图片轮播效果一秒换一个
/*增加一秒换一个的功能/运用定时器的用法。body,div,ul,li,img{margin: 0px;padding: 0px;}#menu{width: 496px;margin: auto;}#head{border: 1px solid blue;}#head img{width: 100%;height: 30原创 2015-12-21 10:34:34 · 1006 阅读 · 0 评论 -
Javascript面向对象及组件的详细介绍(三)面向对象的拖拽
面向对象的拖拽> html> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8"> title>无标题文档title> style> #div1 div,#div2 div{ width:200px; height:200px; border:1px #0原创 2015-12-30 20:15:44 · 256 阅读 · 0 评论 -
Javascript面向对象及组件开发(二)面向对象的写法
面向对象的写法> html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> title>无标题文档title> script> function 构造函数(){原创 2015-12-30 20:12:06 · 447 阅读 · 0 评论 -
Javascript面向对象及组件开发的详细介绍(一)
> html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> title>无标题文档title> script> var arr = []; arr.number原创 2015-12-30 20:06:34 · 580 阅读 · 0 评论 -
JS 替换 window.onload 的 document.ready
通常我们想要在页面内容加载完成后运行 JS 时,都会使用 window.onload 来处理,比如:1 window.onload = function(){2 alert('Hello World!');3 };这段代码将在页面载入完成后弹出一个 "Hello World!" 的警告框,但是众所周知,window.onload 的特点是页原创 2015-12-30 11:27:55 · 639 阅读 · 0 评论 -
window.onload详解信息
一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项、版权信息 、警告、欢迎光顾之类的话或者作者想要特别提示的信息。其实制作这样的页面效果非常的容易,只要往该页面的HTML里加入几段Javascript代码即可实现。【1、最基本的弹出窗口代码】 window.open ('page.html')原创 2015-12-30 11:09:54 · 553 阅读 · 0 评论 -
js排序算法详细介绍
i] array[j]) { d = array[j]; array[j] = array[i]; array[i] = d; } } } return array;},// 快速排序quickSort: function(array) {原创 2016-01-15 21:20:54 · 255 阅读 · 0 评论 -
js排序的算法
//排序算法window.onload = function(){ var array = [0,1,2,44,4, 324,5,65,6,6, 34,4,5,6,2, 43,5,6,62,43, 5,1,4,51,56,原创 2016-01-15 21:19:27 · 287 阅读 · 0 评论 -
js数组的sort排序详解
body> div> sort()对数组排序,不开辟新的内存,对原有数组元素进行调换 div> div id="showBox"> 1、简单数组简单排序 script type="text/javascript"> var arrSimple=new Array(1,8,7,6); arrSimple.sort();原创 2016-01-15 21:11:51 · 262 阅读 · 0 评论 -
JavaScript拖动层Div代码
无标题文档*{ margin:0; padding:0;} .div{ width:100px; height:100px; position:absolute;left:100px; top:100px; background:#ccc;} var div = document.getElementsByTagName('di原创 2015-12-29 09:57:28 · 345 阅读 · 0 评论 -
JavaScript实现原理简述
在AS3中,使用startDrag()就能实现拖拽,但是js中,却没有此方法,但是也是可以实现的,说穿了,挺简单的。实现拖拽方法不少,我呢,js功力尚浅,只知道一种实现原理。如下:①鼠标按下+鼠标移动 → 拖拽②鼠标松开 → 无拖拽③鼠标偏移 → 拖拽距离用JavaScript事件方法表示就是:① onmousedown + onmousemove → startDrag(原创 2015-12-29 08:48:27 · 627 阅读 · 0 评论 -
Javascript面向对象及组件详细介绍(四)包装对象
包装对象包装对象包装对象包装对象包装对象> html> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8"> title>无标题文档title> script> /*function Aaa(){ this.name = '小明';原创 2015-12-30 20:18:33 · 238 阅读 · 0 评论 -
Javascript面向对象及组件详细介绍(五)原型链
原型链原型链原型链原型链原型链> html> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8"> title>无标题文档title> script> //原型链 : 实例对象与原型之间的连接,叫做原型链 //原型链的最外层 : Ob原创 2015-12-30 20:20:00 · 457 阅读 · 0 评论 -
javascript监听键盘事件的解释
1. 监听键盘事件源和键盘动作来实现不同的操作//Form中的控件的名字都为数字如:1,2,3 ...//这样在控件比较多的情况下可以比较容易对事件来源进行分类var id=parseInt(event.srcElement.name);var keyid = event.keyCode;if(id>6 && id if(event.keyCode>=48 &&原创 2016-01-04 21:10:56 · 503 阅读 · 0 评论 -
判断JavaScript对象为null或者属性为空的方法
首先说下null与undefined区别:对已声明但未初始化的和未声明的变量执行typeof,都返回"undefined"。null表示一个空对象指针,typeof操作会返回"object"。一般不显式的把变量的值设置为undefined,但null相反,对于将要保存对象的变量,应明确的让该变量保存null值。?var bj;原创 2016-01-04 21:00:26 · 664 阅读 · 0 评论 -
pasteHTML兼容ie,firefox,chrome等浏览器
function test() { if (document.selection && document.selection.createRange) { var myRange = document.selection.createRange(); var m = myRange.pasteHTML(''); } else if (window.getSe原创 2016-01-04 20:57:29 · 456 阅读 · 0 评论