js | 易学教程

js实现图片轮播

阅读更多关于 js实现图片轮播

鼠标点击左右键可切换图片，且鼠标移入右下角数字也可切换图片。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> /*重置样式*/ *{margin: 0;padding: 0; list-style: none;} /*wrap的轮播图和切换按钮样式*/ .wrap{height: 445px;width: 100%; overflow: hidden;position: relative;} .wrap ul{position: absolute;} .wrap ul li{height: 445px;} .wrap ul li img {height: 445px;width: 100%;} .wrap ol{position: absolute;right: 10px;bottom: 10px;} .wrap ol li{height: 20px;width: 20px; background-color:#fff;border: 1px solid #eee; margin-left: 10px;float:left; line-height: 20px; text-align: center

在前台引用JSON对象

阅读更多关于在前台引用JSON对象

js 评分

阅读更多关于 js 评分

<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <script> onload = function () { var clickIndex = -1; var imgs = document.getElementsByTagName('img'); for (var i = 0; i < imgs.length; i++) { imgs[i].id = i; } for (var i = 0; i < imgs.length; i++) { imgs[i].onmouseover = function () { for (var i = 0; i < imgs.length; i++) { if (imgs[i].id<=this.id) { imgs[i].src = 'star2.png'; } else{ imgs[i].src = 'star1.png'; } } }; imgs[i].onmouseleave = function () { for (var i = 0; i < imgs.length; i++) { if (i<=clickIndex) { imgs[i].src

图片上的左右箭头js代码

阅读更多关于图片上的左右箭头js代码

<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>图片上的左右箭头js代码</title> </head> <body> <img id="img1" src=" http://img.273.com.cn/200905/20090526133320.JPG " /> <script type="text/javascript"> var Util = {}; //Event对象 Util.Event = { stop: function(ent){ var e = ent||window.event; if (e.preventDefault){ e.preventDefault(); e.stopPropagation(); } else{ e.returnValue = false; e.cancelBubble = true

HTML 商品展示（js）

阅读更多关于 HTML 商品展示（js）

利用Object.indexOf（“.”）返回.的下标在用Object.substr（star，lengh）返回指定长度字符串。star是开始位置，length是截取长度； ———————————————————————————————————————————————————————— <!doctype html> <html> <head> <meta charset="utf-8"> <title>商品展示</title> <style type="text/css"> #id1{ width:248px; height:248px; } img{ display:block; float:left; margin-left:0px; width:40px; height:40px; padding:5px; border:1px solid #CCC; } </style> </head> <body> <div style="width:300px; margin:5% auto"> <img id="id1" src="imange/show1_big.jpg"><br> <img src="imange/show1.jpg"> <img src="imange/show2.jpg"> <img src="imange/show3.jpg"> <img src=

五星评分效果原生js

阅读更多关于五星评分效果原生js

五星评分在很多地方都可以用到，网上也有插件或者相应的代码，在这里我给大家提供一款我自己写的超级简单实用的五星评分代码，连图片都不需要  <ul> <li class="start_li3"><span class="grade">评分：</span> <label><input name="j_class" type="radio" class="disNo" value="1"><span class="start s3" onclick="start('s3',this)">★</span></label> <label><input name="j_class" type="radio" class="disNo" value="2"><span class="start s3" onclick="start('s3',this)">★</span></label> <label><input name="j_class" type="radio" class="disNo" value="3"><span class="start s3" onclick="start('s3',this)">★</span></label> <label><input name="j_class" type="radio" class="disNo"

js 上传图片、压缩、旋转

阅读更多关于 js 上传图片、压缩、旋转

亲测 <!doctype html> <html> <head> <meta charset="utf-8"> <title>js上传图片</title> <script src="/exif.js"></script> </head> <body> <input id="file" type="file"> <script type="text/javascript"> var fileTypes = ['image/jpeg', 'image/gif', 'image/png']; window.onload = function myfunction() { var input = document.getElementById('file'); input.onchange = function () { var files = this.files; for (var i = 0, len = files.length; i < len; i++) { var file = files[i]; if (!fileTypes.includes(file.type)) { alert("只可上传图片") return false; } if (file.size / 1024 > 1025) { photoCompress(file, { quality: 0.3 },

js字符串相关知识点

阅读更多关于 js字符串相关知识点

一、属性　　1、length：字符串长度　　字符串中的每个元素都有对应的下标，总长度为length 　　如：var str = 'hello'; 　　// str[0] = h; str[3] = l; str.length = 5; 　　2、注：字符串不可以被修改，如果必须要改，只能给当前变量，重新赋值　　var str = '亲，包邮哦'; 　　str[0] = '哎'; 　　console.log(str) //亲，包邮哦 (值不变) 　　//可以重新赋值，改变字符串变量　　var str = '亲，包邮哦'; 　　str = '哎，包邮哦'; 　　console.log( str ) //哎，包邮哦（重新赋值，值改变）二、字符串的方法　　1、str.charAt( )：获取指定下标的字符　　var str = 'hello'; 　　console.log(str.charAt(1)); //e 　　或： console.log(str[1]); 　　2、str.charCodeAt() ：（成员方法）获取指定下标字符的ASCII码　　var str = 'hello'; 　　console.log(str.charCodeAt(1)); 　　3、String.fromCharCode()：（静态方法）将指定ASCII码转换成字符　　console

JS使用http协议实现ping功能

阅读更多关于 JS使用http协议实现ping功能

目前项目需要用到，实现原理很简单，提交一个ajax请求，并分别记录发送时间和收到回复时间即可。代码转自：http://www.ttlsa.com/dev/use-js-ping-url-ping-ip/ $.ping = function(option) { var ping, requestTime, responseTime ; var getUrl = function(url){ //保证url带http:// var strReg="^((https|http)?://){1}" var re=new RegExp(strReg); return re.test(url)?url:"http://"+url; } $.ajax({ url: getUrl(option.url)+'/'+ (new Date()).getTime() + '.html', //设置一个空的ajax请求 type: 'GET', dataType: 'html', timeout: 10000, beforeSend : function() { if(option.beforePing) option.beforePing(); requestTime = new Date().getTime(); }, complete : function() { responseTime =

js里面的document.cookie详解

阅读更多关于 js里面的document.cookie详解

设置cookie 每个cookie都是一个名/值对，可以把下面这样一个字符串赋值给document.cookie： document.cookie="userId=828"; 如果要一次存储多个名/值对，可以使用分号加空格（; ）隔开，例如： document.cookie="userId=828; userName=hulk"; 在cookie的名或值中不能使用分号（;）、逗号（,）、等号（=）以及空格。在cookie的名中做到这点很容易，但要保存的值是不确定的。如何来存储这些值呢？方法是用escape()函数进行编码，它能将一些特殊符号使用十六进制表示，例如空格将会编码为“20%”，从而可以存储于cookie值中，而且使用此种方案还可以避免中文乱码的出现。例如： document.cookie="str="+escape("I love ajax"); 相当于： document.cookie="str=I%20love%20ajax"; 当使用escape()编码后，在取出值以后需要使用unescape()进行解码才能得到原来的cookie值，这在前面已经介绍过。尽管document.cookie看上去就像一个属性，可以赋不同的值。但它和一般的属性不一样，改变它的赋值并不意味着丢失原来的值，例如连续执行下面两条语句： document.cookie="userId=828

订阅 js