练习地址: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. 【Henu ACM Round#17 C】Kitahara Haruki's Gift

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 判断sum/2这个价值能不能得到就可以了. 则就是一个01背包模型了. 判断某个价值能否得到. f[j]表示价值j能否得到. f[0 ...

  2. Java 学习(13):抽象类& 抽象方法& 封装

    目录 --- 抽象类 --- 封装 抽象类: 在面向对象的概念中,所有的对象都是通过类来描绘的,但是反过来,并不是所有的类都是用来描绘对象的,如果一个类中没有包含足够的信息来描绘一个具体的对象,这样的 ...

  3. OpenCASCADE Face Normals

    OpenCASCADE Face Normals eryar@163.com Abstract. 要显示一个逼真的三维模型,其顶点坐标.顶点法向.纹理坐标这三个信息必不可少.本文主要介绍如何在Open ...

  4. 关于集合类set

    list中允许有重复的元素,而set中不允许有重复的元素. package cn.hncu.Test; import java.util.HashMap; import java.util.Map; ...

  5. jquery19 ajax()

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 通过js动态创建button

    通过js动态创建button 一.实例描述 通过JS的DOM对象,实现元素的动态创建. 二.效果 三.代码 <!DOCTYPE html> <html lang="zh-c ...

  7. zoj 1119 / poj 1523 SPF (典型例题 求割点 Tarjan 算法)

    poj : http://poj.org/problem?id=1523 如果无向图中一个点 u 为割点 则u 或者是具有两个及以上子女的深度优先生成树的根,或者虽然不是一个根,但是它有一个子女 w, ...

  8. 关于ajax访问express服务器的跨域问题

    在学习es6的时候用promise封装了一个ajax <script type="text/javascript"> function getNews(URL) { l ...

  9. eclipse工作空间配置导出

    由于工作与学习的需求,需要使用不同的工作空间.而eclipse的新建工作空间其他以前的配置都没有继承过来,那么就得重新配置一遍. 经过学习其他前辈们的经验与自己的摸索总结一下3种方法: 方法一:使用e ...

  10. 洛谷——P1137 旅行计划

    https://www.luogu.org/problem/show?pid=1137 题目描述 小明要去一个国家旅游.这个国家有N个城市,编号为1-N,并且有M条道路连接着,小明准备从其中一个城市出 ...