函数return/获取元素样式/封装自己的库
一:函数return
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><script>// return 返回值// 数字、字符串、布尔、函数、对象(元素\[]\{}\null)、未定义// fn1();函数名称加括号等于return后面的值 无论后面是什么类型的值甚至是函数 => 100// alert( fn1().length );// alert( typeof fn1() );function fn1(){// return 100;return 'miaov';}// alert( fn2() );// fn2(20)(10);function fn2(a){return function (b){alert(a+b); // 嘿嘿,我是注释~};}fn3().onload = function (){document.body.innerHTML = 123;};function fn3(){return window;}// alert(fn4());function fn4(){// return ;}// alert( fn5() );function fn5(){return 123;alert(520);}/*return:返回值1) 函数名+括号:fn1() ==> return 后面的值;2) 所有函数默认返回值:未定义;3) return 后面任何代码都不执行了;*/</script></head><body></body></html>
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><style>div { width:100px; height:120px; background:red; }</style><script src="miaov.js"></script><script>$(function(){// $('div1').style.width = '300px';只能获得行间的style with 不能得到样式表中的with.$('btn1').onclick = function (){// alert( $('div1').style.width );// $('div1').style.cssText = 'width:350px;';// alert( getComputedStyle( $('div1') ).width );// IE6 7 8 不兼容,直接在IE9中的汉语调试工具中测试即可,左右两个标准// alert( $('div1').currentStyle.width ); // 兼容IE678,但是标准浏览器比如火狐不兼容/*if( $('div1').currentStyle ){alert( $('div1').currentStyle.width );} else {//解决浏览器兼容问题,属性判断法,版本检测法,很多解决问题。alert( getComputedStyle( $('div1'), 250 ).width );// FF 4.0 之前,现在都38.1版本了,联网自动更新的。}*/// alert( getStyle( $('div1'), 'width' ) );// alert( getStyle( $('div1'), 'height' ) );alert( getStyle( $('div1'), 'marginRight' ) );/* alert( getStyle( $('div1'), 'width' ) );获取到的是计算机(浏览器)计算后的样式也就是真实的background: url() red …… 复合样式(不要获取)backgroundColor 单一样式(不要用来做判断)//能弹出不同的颜色了。IE red火狐chromerrgba(255,0,0)不要有空格,不然全是undefine不要获取未设置后的样式:不兼容getStyle( $('div1'), 'marginRight' )*/};});</script></head><body><input id="btn1" type="button" value="按钮" /><div id="div1"></div></body></html>
function $( v ){if( typeof v === 'function' ){window.onload = v;} else if ( typeof v === 'string' ) {return document.getElementById(v);} else if ( typeof v === 'object' ) {return v;}}function getStyle( obj, attr ){return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle( obj )[attr];}
函数return/获取元素样式/封装自己的库的更多相关文章
- JavaScript获取元素样式
原生的JavaScript获取写在标签内部的样式很简单: <div class="test" id="test" style="width:10 ...
- javascript 获取元素样式的方法
javascript 获取元素样式常用方法. Javascript获取CSS属性值方法:getComputedStyle和currentStyle 1 .对于元素的内联CSS样式(<div s ...
- 原生js获取元素样式
摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...
- Vue 获取元素样式 元素高度
看到这个问题我第一时间想的竟然是JS 不知道你是怎么想的 不过昨天有一个小哥哥 问我一个Vue的 哈哈哈 get了 我当时问他为什么不用JS获取 他说 这个性能更高 那我们来看看这个高性能的获取元素高 ...
- (转载)记录函数 getStyle() 获取元素 CSS 样式
设置元素(element)的css属性值可以用element的style属性,例如要将element的背景色设置为黑色,可以这么做: element.style.backgroundColor = ' ...
- Js获取元素样式值(getComputedStyle¤tStyle)兼容性解决方案
因为:style(document.getElementById(id).style.XXX)只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. 一般js获取内部样式和外部样式使用 ...
- js学习笔记7----return,arguments及获取元素样式
1.return:返回值 1)函数名+括号:fn() ===> return; 2) 所有函数默认返回值:undefind; 3) return后面所有的代码都不会执行; 2.arguments ...
- 获取元素样式 currentStyle 和 getcomputedStyle
场景 你要获取某一元素的样式,可是没有获取到,返回的值为undefined,可是有时候又能成功? 为什么? 因为,xx.stly.xxx 可以获取的样式信息,是dom元素style属性里的样式,对于通 ...
- JS常用方法(获取Class、获取元素样式、事件监听、cookie、ajax等)
var Util = {}; Util.byClass = function (oClass) {//全局获取 var tags = document.all ? document.all : doc ...
随机推荐
- 扁平化设计的最新趋势 – 长阴影(Long Shadow)
随着互联网的发展,网页设计变得越来越复杂,如今设计的外观和感觉实现网站功能说使用的开发技术一样重要.互联网的功能远远不只是基本的信息共享,现在人们对网站的期望是远远大于几年前的. 如今,HTML5 & ...
- Direct2D开发:绘制网格
转载请注明出处:http://www.cnblogs.com/Ray1024 一.引言 最近在使用Direct2D进行绘制工作中,需要实现使用Direct2D绘制网格的功能.在网上查了很多资料,终于实 ...
- ASP.NET HTTP模拟提交通用类 GET POST
用法: WebRequestSugar ws = new WebRequestSugar(); //可选参数 //ws.SetAccept //ws.SetContentType //ws.SetC ...
- SystemTap知识(二)
Unbuntu安装systemtap: http://www.cnblogs.com/hdflzh/archive/2012/07/25/2608910.html 1 更新源到http://mirro ...
- js 各种数值类型正则匹配检测
随拿随用只js正则表达式,反正平时工作我是不写正则的,大神请自动绕行: 验证数字的正则表达式集验证数字:^[0-9]*$验证n位的数字:^\d{n}$验证至少n位数字:^\d{n,}$验证m-n位的数 ...
- tomcat端口被占用
这里就以win7为例进行讲解. 首先打开cmd,打开的方法很简单,在开始菜单中直接输入即可.同样也可以按下win+R打开运行,然后输入cmd即可. 在dos命令中输入以下命令查询正在被使用的端口号以及 ...
- 【Win10】【译】提交 UWP 应用时遇到意料之外的语言?
原文链接:http://metronuggets.com/2015/12/03/got-unexpected-extra-languages-in-your-uwp-store-submission/ ...
- 【Win10】【Win2D】实现控件阴影效果
学过 WPF 的都知道,在 WPF 中,为控件添加一个阴影效果是相当容易的. <Border Width="100" Height="100" Backg ...
- Linq专题之Linq查询from子句
Linq查询表达式包含8个常用的子句:from.where.select.join.into.orderby.group.let.我们来看看详细的说明. from: 指定查询操作的 ...
- zTree的使用
一.节点模糊搜索功能:搜索成功后,自动高亮显示并定位.展开搜索到的节点. 二.节点异步加载:1.点击展开时加载数据:2.选中节点时加载数据. 前台代码如下: <script type=" ...