1、获取屏幕尺寸

document.documentElement.scrollWidth;
document.documentElement.scrollHeight;
$(window).width();
$(window).height();

2、页面加载完成执行代码块及DOM加载完毕之后执行

$(document).ready(function(){
//脚本
}); $().ready(function() {
//脚本
}) $(function() {
//脚本
})

3、页面分辨率改变后执行

window.onresize=function(){
//脚本
}
$(window).resize(function(){
//脚本
});

4、定时器

setInterval(, 0)

5、点击跳转页面

<li onclick="window.open('xxx.html','_self')"></li>

6、遍历所有td2类里的数值,根据数值大小改变数值颜色

for (var i = 0; i < $('.td2').length; i++) {
var reference = $('.td2').eq(i).text();
if (reference < 50) {
$('.td2').eq(i).css({
color: '#007DFF',
});
} else if (reference >= 50 && reference < 100) {
$('.td2').eq(i).css({
color: '#15C046',
});
}else if (reference >= 100 && reference < 200) {
$('.td2').eq(i).css({
color: '#FFC000',
});
} else {
$('.td2').eq(i).css({
color: '#FF0909',
});
}
}

7、返回顶部

$('.class').on('click',function(){
$('body,html').animate({
scrollTop: 0
},500);
return false;
})

8、判断某个标签是否含有某个类

$(this).hasClass('box-show')

9、隐藏多余的内容

// each遍历
$('.li-out').each(function() {
var words = $(this).text().length;
if (words > 96) {
$(this).text($(this).text().slice(0, 96) + "...");
}
});

10、获取当前时间自己写格式

var date = new Date;
var year = date.getFullYear();
var month = date.getMonth() + 1;
month = (month < 10 ? "0" + month : month);
var day = date.getDate();
day = (day < 10 ? "0" + day : day);
var week_number = date.getDay();
var week;
switch (week_number) {
case 0:
week = "星期日";
break;
case 1:
week = "星期一";
break;
case 2:
week = "星期二";
break;
case 3:
week = "星期三";
break;
case 4:
week = "星期四";
break;
case 5:
week = "星期五";
break;
case 6:
week = "星期六";
break;
}
$('.get_year').text(year);
$('.get_month').text(month);
$('.get_day').text(day);

11、点击空白区域下拉菜单收回

$("body").click(function(event) {
if ($(event.target).parents(".select").length === 0) {
$(".select ul").hide();
}
});

12、阻止冒泡

even.stopPropagation()
//ie 阻止冒泡
even.cancelBubble = true

13、菜单切换

$('.top-li').click(function(event){
$(this).addClass('active').siblings().removeClass('active').parent().parent().next('.llnconter').children('.con-ul').eq($(this).index()).show().siblings('.con-ul').hide()
});

14、点击展开隐藏div

$('.class').click(function() {
$(this).toggleClass('class'); //按钮变化效果
$('.class').animate({ //需要隐藏展开的div
width: 'toggle'
}, 350) //动画时间
});

15、echarts图表中在legend里带入数据和百分比占比

legend: {
orient: 'vertical',
right: 0 *scale,
top: 30 *scale,
height: 150 *scale,
itemWidth: 9 * scale,
itemHeight: 9 * scale,
itemGap: 18 * scale,
data: ['诊查1收入占比', '诊查2收入占比', '诊查3收入占比', '诊查4收入占比', '诊查5收入占比', '挂号1收入占比', '挂号2收入占比', '挂号3收入占比', '挂号4收入占比', '挂号5收入占比'],
formatter: function (e) {
var total = 0
for (var i = 0; i < llnoption6.series[0].data.length; i++) {
total += llnoption6.series[0].data[i].value
}
for (i = 0; i < llnoption6.series[0].data.length; i++) {
var ePercent = (llnoption6.series[0].data[i].value / total * 100).toFixed(2) + '%'
if (llnoption6.series[0].data[i].name === e) {
return '{a|'+ e +'}{b| ¥'+ llnoption6.series[0].data[i].value + '}{c'+i+'| '+ ePercent +'} '
}
}
},
textStyle: {
rich: {
a: {
color: '#999',
fontSize: 12 * scale
},
b: {
color: '#333',
fontSize: 12 * scale
},
c0: {
color: '#44ABFF',
},
c1: {
color: '#31D1F7',
},
c2: {
color: '#20C9C6',
},
c3: {
color: '#3BDA97',
},
c4: {
color: '#73DF6D',
},
c5: {
color: '#D5DA37',
},
c6: {
color: '#F6C541',
},
c7: {
color: '#FE9C56',
},
c8: {
color: '#F96A6A',
},
c9: {
color: '#FB7AA2',
},
}
}
},

legend

16、

js及jquery常用代码的更多相关文章

  1. jquery常用代码集锦

    1. 如何修改jquery默认编码(例如默认GB2312改成 UTF-8 ) 1 2 3 4 5 $.ajaxSetup({     ajaxSettings : {         contentT ...

  2. 三种动态加载js的jquery实例代码另附去除js方法

    !-- 这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getscript("test.js&quo ...

  3. js与jquery常用数组方法总结

    昨天被问数组方法的时候,问到sort()方法是否会改变原来的数组.本来我猜是不会,也是这么说,马上我又觉得,知识这种东西,不确定的时候直接说不确定或不知道就好,只是凭借着不确定的猜测或者是记忆,害人害 ...

  4. js及jquery常用插件

    1.backstretch背景图片插件 可实现背景自适应效果 <script src="dist/js/lib/backstretch/jquery.backstretch.min.j ...

  5. 【js】前端 js/jquery 常用代码和实践

    1.获取某天后几天的日期 //d为传入的日期 days为d后面的几天function getAfterDate(d,days){ var dd = new Date(d); dd.setDate(dd ...

  6. js|jquery常用代码

    页面重定位: window.location.replace("http://www.bczs.net"); window.location.href = "http:/ ...

  7. Jquery学习总结(1)——Jquery常用代码片段汇总

    1. 禁止右键点击 ? 1 2 3 4 5 $(document).ready(function(){     $(document).bind("contextmenu",fun ...

  8. js和jQuery常用选择器

    笔者觉得js是前台基础中的基础,而其选择器则是js基础中的基础,因长期使用框架导致js生疏,所有查资料,回顾一下js的常用选择器: 1.document.getElementById("id ...

  9. jquery常用代码

    转自:未找到 以下是jquery中比较常用的一些操作实现方式: $("标签名") //取html元素 document.getElementsByTagName("&qu ...

随机推荐

  1. C++学习书籍推荐《Effective STL(英文)》下载

    百度云及其他网盘下载地址:点我 作者简介 Scott Meyers is one of the world's foremost authorities on C++, providing train ...

  2. C语言学习书籍推荐《C语言程序设计 现代方法(第2版)》下载

    下载地址:点我 C语言仍然是计算机领域的通用语言之一,但现在的C语言已经和当初的时候大不相同了.本书主要的一个目的就是通过一种“现代方法”来介绍C语言,书中强调标准C,强调软件工程,不再强调“手工优化 ...

  3. windows7(win7)64/32位激活工具

    win7激活工具中文绿色免费版是改自binbin的作品,我们修改的windows7激活工具grldr模拟激活是别人的东西,能激活win7旗舰.原作者是binbin,其他的激活工具都是基于grldr模拟 ...

  4. Spring Boot + Elasticsearch 实现索引的日常维护

    全文检索的应用越来越广泛,几乎成了互联网应用的标配,商品搜索.日志分析.历史数据归档等等,各种场景都会涉及到大批量的数据,在全文检索方面,方案无外乎Lucene.Solr.Elasticsearch三 ...

  5. 剑指offer第二版-1.赋值运算符函数

    面试题1:赋值运算符函数题目要求:为自定义类添加赋值运算符函数,考察一些细节点的书写.

  6. STM32F072从零配置工程-建立工程文件

    快速建立工程有两种方法: 第一种是通过官方提供的外设库来搭建,好处是使用库函数,而不需要深入研究寄存器配置: 第二种是通过STM32CubeMX,好处是直观快速,可以直接帮你配置好功能和时钟,不过使用 ...

  7. MyBatis从入门到精通:第一章数据库创建文件

    /*创建数据库mybatis,并指定编码方式为utf8,字符比较规则为utf8_general_ci*/ CREATE DATABASE mybatis DEFAULT CHARACTER SET u ...

  8. html css 布局小细节

    学了两个月的html和css每天都重复一样的生活,敲着大同小异的代码,这样的生活枯燥无味.我腻了,我也累了!小米首页算是我写的第三个静态页面,写了好久,很多细节都把握不好,下面的这个简单的布局细节是我 ...

  9. .net持续集成sonarqube篇之sonarqube安装与基本配置

    系列目录 Sonarqube下载与安装 Sonarqube下载地址是:https://www.sonarqube.org/downloads/下载版本有两个,一个是长期支持版,另一个是最新版,此处安装 ...

  10. sessionID是如何在客户端和服务器端传递的?

    sessionID是如何在客户端和服务器端传递的? 服务器初次创建session的时候后返回session到客服端(在返回头(response)中有setCookie),浏览器会把sessionnam ...