练习地址:http://www.fgm.cc/learn/lesson2/05.html

<script>
window.onload = function(){
var oDiv = document.getElementById('div1');
// var oInput1 = document.getElementsByTagName('input')[0].value;
// var oInput2 = document.getElementsByTagName('input')[1].value;
// 不应该在window.onload 获取变量时就获取 value, 这样后面输入框的值发生变化就获取不到!!!
var oInput1 = document.getElementsByTagName('input')[0];
var oInput2 = document.getElementsByTagName('input')[1]; var oBtn1 = document.getElementsByTagName('button')[0];
var oBtn2 = document.getElementsByTagName('button')[1]; oBtn1.onclick = function()
{
changeProperties(oDiv, oInput1.value, oInput2.value);
}; oBtn2.onclick = function()
{
oDiv.style.cssText = '';
// oDiv.removeAttribute("style") 另一种方法。
};
}; function changeProperties(obj, txt1, txt2)
{
obj.style[txt1] = txt2; // style后面必须用[]把变量框起来,不能直接用. 点号
}; // 这里用var之后,前面怎么调用? 参考:
// var myFn = function(a, b)
// {
// alert(a.value);
// alert(b.value)
// }; // oBtn.onclick = function()
// {
// myFn(oInput[0],oInput[1])
// }; </script>

JS学习笔记 - fgm练习 2-5 - 函数传参 设置div样式的更多相关文章

  1. 微信小程序开发:学习笔记[8]——页面跳转及传参

    微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...

  2. JS学习笔记 - fgm练习 - 鼠标移入/移出div样式改变

    思路: div的默认样式正常设置. 鼠标移入时,发生改变的样式有3个,即 边框颜色,div背景色,字体颜色. 把这三个css改变设置在一个类名下,再通过js给div动态 添加/去除这个类名,实现div ...

  3. JS学习笔记 - fgm练习 - 多按钮控制同个div属性

    总结: 1. 注意body里的结构安排,全部装在大div,避免多次设置不同部分居中. 2. 一排按钮居中:装在大div里,text-align: center; 3. 把相同的部分封装成函数,即 同个 ...

  4. node.js学习笔记(二)——回调函数

    Node.js 异步编程的直接体现就是回调. 那什么是回调呢?回调指的是将一个函数作为参数传递给另一个函数,并且通常在第一个函数完成后被调用.需要指明的是,回调函数不是由该函数的实现方直接调用,而是在 ...

  5. JS学习笔记 - fgm练习 2-12- 全选反选 判断CheckBox是否选中 &&运算符

    练习地址:http://www.fgm.cc/learn/lesson2/12.html 总结: 1.  && 运算符,从左向右依次执行,如果遇到 false,就不再继续执行后面的语句 ...

  6. 【学习】js学习笔记:内置顶层函数eval()的兼容用法

    今天学了一个内置顶层函数,eval();其作用是将字符串转换成javascript命令执行,但必须符合语法,否则会报错. 如果写成window.eval(),则其定义的变量会在全局生效. 但是,在IE ...

  7. JS学习笔记 - fgm练习 2-11- 改变图片路径 var img = new Image(); 图片预加载

    <style> *{ margin: 0;padding: 0; list-style: none; } body{ background: black; } .outer{ margin ...

  8. JS学习笔记 - fgm练习 - 数字自增 定时器 数字比大小Math.max

    <script> window.onload = function(){ var oP = document.getElementsByTagName('p')[0]; var i = 0 ...

  9. JS学习笔记 - fgm练习 - 限制输入框的字符类型 正则 和 || 或运算符的运用 i++和++i

    <script> window.onload = function(){ var aInp = document.getElementsByTagName('input'); var oS ...

随机推荐

  1. Appium Android Bootstrap源代码分析之启动执行

    通过前面的两篇文章<Appium Android Bootstrap源代码分析之控件AndroidElement>和<Appium Android Bootstrap源代码分析之命令 ...

  2. RecyclerView实现瀑布流布局

    RecyclerView本身提供了三个LayoutManager的实现 LinearLayoutManager GridLayoutManager StaggeredGridLayoutManager ...

  3. ubuntu-删除内核

    今天进入公司第一天,公司需要给电脑安装ubuntu,这个是由it部门帮忙安装的.但是,我不小心升级了内核版本,接下来就悲剧了,因为内核版本升级以后,直接导致了环境错误,很多公司内部使用的工具都不能用了 ...

  4. Android Gson解析json工具类封装

    package com.springSecurity.gson; import java.util.ArrayList; import java.util.List; import java.util ...

  5. go语言的一个gui 开源 项目 https://github.com/andlabs/ui

    go语言的一个gui 开源 项目  https://github.com/andlabs/ui 1 安装  mingw-w64  链接地址: http://mingw-w64.sourceforge. ...

  6. 【DRF路由】

    在urls.py文件中按照如下步骤写,即可正确使用DRF的内置路由. from .views import BookModel # 1. 导入我们的视图 from rest_framework.rou ...

  7. telint---切换当前正在运行的Linux系统的运行等级

    telint命令用于切换当前正在运行的Linux系统的运行等级 Send control commands to the init daemon. --help Show this help --no ...

  8. pytest使用问题总结

    问题一.AttributeError: module 'pytest' has no attribute 'allure'解决方法:pip3 uninstall pytest-allure-adapt ...

  9. flask_wtf flask 的 CSRF 源代码初研究

    因为要搞一个基于flask的前后端分离的个人网站,所以需要研究下flask的csrf防护原理. 用的扩展是flask_wtf,也算是比较官方的扩展库了. 先上相关源代码: def validate_c ...

  10. 关于IDEA编译器在初次使用thymeleaf 引入无效 , 导致th无法使用的原因

    首先pom.xml里面要导入thymeleaf的依赖 然后在html中加入  xmlns:th="http://www.thymeleaf.org" 最后点击file ---> ...