一:函数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>
三:封装自己的库
<script src="miaov.js"></script>
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/获取元素样式/封装自己的库的更多相关文章

  1. JavaScript获取元素样式

    原生的JavaScript获取写在标签内部的样式很简单: <div class="test" id="test" style="width:10 ...

  2. javascript 获取元素样式的方法

    javascript 获取元素样式常用方法. Javascript获取CSS属性值方法:getComputedStyle和currentStyle  1 .对于元素的内联CSS样式(<div s ...

  3. 原生js获取元素样式

    摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...

  4. Vue 获取元素样式 元素高度

    看到这个问题我第一时间想的竟然是JS 不知道你是怎么想的 不过昨天有一个小哥哥 问我一个Vue的 哈哈哈 get了 我当时问他为什么不用JS获取 他说 这个性能更高 那我们来看看这个高性能的获取元素高 ...

  5. (转载)记录函数 getStyle() 获取元素 CSS 样式

    设置元素(element)的css属性值可以用element的style属性,例如要将element的背景色设置为黑色,可以这么做: element.style.backgroundColor = ' ...

  6. Js获取元素样式值(getComputedStyle&currentStyle)兼容性解决方案

    因为:style(document.getElementById(id).style.XXX)只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. 一般js获取内部样式和外部样式使用 ...

  7. js学习笔记7----return,arguments及获取元素样式

    1.return:返回值 1)函数名+括号:fn() ===> return; 2) 所有函数默认返回值:undefind; 3) return后面所有的代码都不会执行; 2.arguments ...

  8. 获取元素样式 currentStyle 和 getcomputedStyle

    场景 你要获取某一元素的样式,可是没有获取到,返回的值为undefined,可是有时候又能成功? 为什么? 因为,xx.stly.xxx 可以获取的样式信息,是dom元素style属性里的样式,对于通 ...

  9. JS常用方法(获取Class、获取元素样式、事件监听、cookie、ajax等)

    var Util = {}; Util.byClass = function (oClass) {//全局获取 var tags = document.all ? document.all : doc ...

随机推荐

  1. Linux内核知识

    版本 linus树 Linux内核最初创始人--Linus Torvalds管理一个Linus树,linus树也称为主线(mainline).一般指的upstream,"上游",也 ...

  2. [Tool] 常用开发工具注册码(持续更新)

    OS win10 激活 命令行 打开命令提示符( 管理员 ) 输入 slmgr /ipk W269N-WFGWX-YVC9B-4J6C9-T83GX 回车 再输入 slmgr /skms kms.xs ...

  3. 自定义JSTL标签和函数库

    一.自定义JSTL标签 1.编写标签处理类: (1)实现 SimpleTag 接口,通过 setJspContext()方法可以获取到 jspContext 对象,实际上也是 pageContext ...

  4. 0525Sprint回顾

    1.回顾组织 主题:“我们下次怎么样才能更加认真对待?” 时间:设定为1至2个小时. 参与者:整个团队. 场所:能够在不受干扰的情况下讨论. 秘书:指定某人当秘书,筹备.记录.整理.  2.回顾流程 ...

  5. Winform开发框架之权限管理系统改进的经验总结(4)--用户分级管理

    在实际的系统应用环境中,用户的分级管理一般也是比较常见的功能,小的业务系统可以不需要,但是一般涉及到集团.分子公司.或者是事业单位里面的各个处室或者某某局的人员管理,这些分级管理就显得比较必要,否则单 ...

  6. js定时器调用参数的方法

    var userName="Tony"; //根据用户名显示欢迎信息 function ss(_name){ alert("ss,"+_name); } 使用字 ...

  7. 002_Razor简介

    关于 Razor: Razor 语句以 @ 字符开始.在使用 Razor 声明视图模型对象的类型时要使用小写字母,如在本例文件 Index.cshtml 文件中 @model 以小写的 m 开头,但要 ...

  8. AC自动机---病毒侵袭

    HDU 2896 题目网址: http://acm.hust.edu.cn/vjudge/contest/view.action?cid=110773#problem/B Description 当太 ...

  9. [moka同学笔记]bootstrap基础

    1.导航栏的制作 <nav class="nav navbar-default navbar-fixed-top" role="navigation"&g ...

  10. CentOS 7.2 搭建 Openvpn 服务器

    本文将以目前最新的openvpn-2.3.13.tar.gz为例来介绍如何在Linux系统中安装.配置及使用OpenVPN. 在这里,我们选用了一台预装CentOS 7.2 64位系统的计算机作为Op ...