CSS部分

1、文本框不可点击

.inputDisabled{ background-color: #eee;cursor: not-allowed;}

2、禁止复制粘贴

onpaste="return false" oncontextmenu="return false" oncopy="return false" oncut="return false"

JS部分

1、实现复选框部分选中状态

 <input id="chk1" type="checkbox" />
<script>
document.getElementById('chk1').indeterminate = true;
</script>

2、浅拷贝  参考:http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_inheritance_continued.html

 function extendCopy(p) {
var c = {};
for (var i in p) {      
c[i] = p[i];    
}
c.uber = p;
return c;  
}

3、深拷贝  参考:http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_inheritance_continued.html

function deepCopy(p, c) {    
var c = c || {};    
for (var i in p) {      
if (typeof p[i] === 'object') {        
c[i] = (p[i].constructor === Array) ? [] : {};        
deepCopy(p[i], c[i]);      
} else {         
c[i] = p[i];      
}    
}    
return c;  
}

4、生成lowerValue(包括)到 upperValue(包括)的随机整数。

 function selectFrom(lowerValue, upperValue) {
var choices = upperValue - lowerValue + 1;
return Math.floor(Math.random() * choices + lowerValue);
}

5、确定属性是原型中的属性

 function hasPrototypeProperty(object, name) {
return !object.hasOwnProperty(name) && (name in object);
}

6、跨浏览器取得窗口左边和上边的位置

 var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;

7、获取地址栏参数

 /*
获取页面url参数
调用方法:
alert(GetQueryString("参数名1"));
alert(GetQueryString("参数名2"));
*/
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]);
return null;
}
/*
获取页面url参数
调用方法:
Request = GetRequest();
var 参数1,参数2,参数3,参数N;
参数1 = Request['参数1'];
参数2 = Request['参数2']; */
function GetRequest() {
var url = location.search; //获取url中"?"符后的字串
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
}
}
return theRequest;
}

8、计算元素在页面的偏移量

 //左偏移量
function getElementLeft(element) {
var actualLeft = element.offsetLeft;
var current = element.offsetParent;
while (current !== null) {
actualLeft += current.offsetLeft;
current = current.offsetParent;
}
return actualLeft;
}
//上偏移量
function getElementTop(element) {
var actualTop = element.offsetTop;
var current = element.offsetParent;
while (current !== null) {
actualTop += current.offsetTop;
current = current.offsetParent;
}
return actualTop;
}

9、判断浏览器类型

 function getBrowserType() {
var ua = navigator.userAgent.toLowerCase(), browserType = "";
if (window.ActiveXObject) {
//Sys.ie = ua.match(/msie ([\d.]+)/)[1];
Sys.ie = ua;
browserType = "IE";
}
else if (document.getBoxObjectFor) {
//Sys.firefox = ua.match(/firefox\/([\d.]+)/)[1];
Sys.firefox = ua;
browserType = "firefox";
}
else if (window.MessageEvent && !document.getBoxObjectFor) {
//Sys.chrome = ua.match(/chrome\/([\d.]+)/)[1];
Sys.chrome = ua;
browserType = "chrome";
}
else if (window.opera) {
//Sys.opera = ua.match(/opera.([\d.]+)/)[1];
Sys.opera = ua;
browserType = "opera";
}
else if (window.openDatabase) {
//Sys.safari = ua.match(/version\/([\d.]+)/)[1];
Sys.safari = ua;
browserType = "safari";
}
return browserType;
}

一些CSS/JS小技巧的更多相关文章

  1. html/css/js小技巧实例

    一些学习中碰到的小技巧 让div自动撑起来: .clearfix:after{ content: "."; clear: both; display: block; visibil ...

  2. CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅

    首页   登录注册         CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅 阅读 8113 收藏 927 2017-09-26 原文链接:github.com 腾讯云容器服务CSS,立 ...

  3. css的小技巧

    前几天看到<css揭秘>这本书,第一感觉是 css怎么能出这么厚的一本书,不过 细细一想,用好css真的可以实现很多想要的效果,节省很多js代码. 总结几个css的小技巧: 1,将所有元素 ...

  4. [转载]Js小技巧||给input type=“password”的输入框赋默认值

    http://www.cnblogs.com/Raywang80s/archive/2012/12/06/2804459.html [转载]Js小技巧||给input type="passw ...

  5. 第八十四节,css布局小技巧及font-awesome图标使用

    css布局小技巧及font-awesome图标使用 图片鼠标放上去遮罩效果,显示文字 当鼠标放上去时 /*最外层div*/ .a{ width: 384px; height: 240px; backg ...

  6. js小技巧总结

    js小技巧总结 1.Array.includes条件判断 function test(fruit) { const redFruits = ["apple", "stra ...

  7. css样式小技巧

    1.css样式小技巧 HTML怎样设定使背景图片不随页面滚动而滚动 background-attachment:fixed; 2.实现li a 超过长度内容出现省略号… overflow:hidden ...

  8. javascript小技巧-js小技巧收集(转)

    本文转载自:http://blog.csdn.net/ocean20/article/details/2498699 每一项都是js中的小技巧,但十分的实用! 1.document.write(&qu ...

  9. 一些常用的html/CSS效果---小技巧

    我常用的重置样式表reset.css /*===============基础信息================*/ *{border: 0;padding: 0;margin: 0;} table ...

随机推荐

  1. 每天一个Linux命令(11)--nl命令

    nl命令在Linux系统中用来计算文件中行号.nl可以将输出的文件内容自动的加上行号,其默认的结果与cat -n 有点不太一样,nl可以将行号做比较多的显示设计,包括位数与是否自动不起0等等的功能. ...

  2. 不要怂,就是GAN (生成式对抗网络) (六):Wasserstein GAN(WGAN) TensorFlow 代码

    先来梳理一下我们之前所写的代码,原始的生成对抗网络,所要优化的目标函数为: 此目标函数可以分为两部分来看: ①固定生成器 G,优化判别器 D, 则上式可以写成如下形式: 可以转化为最小化形式: 我们编 ...

  3. 2017 3-4/5 两天的学习的REVIEW

    明天就要去面试啦,去感受一下,估计又是一顿虐,蓝瘦-- 3月4日:计算机安全基础技术与原理方面的学习 密码体制(密码)由五个部分组成: 消息空间(m),密文空间(c),密钥空间(k),加密算法(E), ...

  4. LINQ笔记

    LINQ概述 语言集成查询(Language intergrated Query,LINQ)在C#编程语言中集成了查询语法. 可以使用相同的语法访问不同的数据源 提供了不同数据源的抽象层,所有可以使用 ...

  5. Bootsrap 的 Carousel

    一.简介 Carousel 就是指轮播图,这里 有完整的代码例子.它可以很简单的就构造出来,结构如下: div.carousel.slide[data-ride="carousel" ...

  6. python3.6 简单爬虫

    # coding='UTF-8' from bs4 import BeautifulSoup # 引入beautifulsoup 解析html事半功倍 import re import urllib ...

  7. Node.js 基础介绍

    什么是Node.js 官网介绍: Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js us ...

  8. CCNA网络工程师学习进程(10)NAT的配置

     NAT(Network Address Translation,网络地址转换)是将IP 数据包头中的IP 地址转换为另一个IP 地址的过程.     (1)NAT简介:     在实际应用中,NAT ...

  9. pyqt样式表语法笔记(上) --原创

    pyqt样式表语法笔记(上) pyqt QSS python 样式表 因为软件课设的原因开始学习使用pyqt4,才发现原来它也有样式表,而且语法跟css基本相同,而且一些功能实现起来感觉比js要简单方 ...

  10. JS中new的自定义实现创建实例对象

    我们都知道在JS中通常通过对象字面量和new关键字来创建对象,那么今天我就来给大家讲讲new是怎么创建实例对象的:首先创建一个构造函数: function Person(name,age){ this ...