功      能:在同一个网页上切换显示不同的图片与文本(*亲测可用)

使用属性:

a) document.getElementById(" ") ——返回一个与给定的id属性值的元素节点对应的元素——[(" ")内元素为指定的id名]

b) document.getElementByTagName(" ") ——返回一个数组——[(" ")为元素名,例如:a;p;li等]

c).getAttribute(" ") ——获取元素属性的值 ——[(" ")打算查询的属性名字,例如:href;title等]、

d).setAttribute(" ", " ") ——设置或修改某个属性的内容

e) onclick="showpic(this); return false" ——onclick:事件处理函数,用户点击某个链接时触发的一个动作;return false:链接被点击时的默认行为将不会发生

f) document.getElementById("descriptor").chlidNodes[0].nodeValue ——获取P元素的文本内容(chlidNodes[0]相当于firstchild)

HTML:

JS:

CSS:

JavaScript 编程艺术-第4章(JavaScript美术馆)代码的更多相关文章

  1. JavaScript编程艺术-第7章代码汇总(2)

    [7.4节] 重回“JavaScript美术馆”代码 ***亲测可用*** HTML: JS:

  2. JavaScript编程艺术-第6章(JavaScript美术馆改进版)代码

    基于[第4章(JavaScript美术馆)代码]进行改进(***HTML与JS分离***) (*亲测可用) HTML: JS: CSS:

  3. JavaScript DOM编程艺术第四章 — JavaScript图片库案例研究

    这一章通过JavaScript图片库案例,学习了一些DOM属性. HTML代码 <!DOCTYPE html> <html> <head> <meta cha ...

  4. JavaScript编程艺术-第10章-10.2-实用的动画

    10.2-实用的动画 ***代码亲测可用*** HTML: <!DOCTYPE HTML> <html> <head> <meta charset=" ...

  5. JavaScript编程艺术-第7章代码汇总(1)

    1.document.write()(HTML与JS未分离) HTML: JS: 2..innerHTML(直接覆盖) HTML: JS: 3.getAttribute.setAttribute.ge ...

  6. JavaScript编程艺术-第10章-10.1-动画

    10.1—最简单的动画 ***代码亲测可用*** 动画:让元素位置随着时间而不断地发生变化 HTML: <!DOCTYPE HTML> <html> <head> ...

  7. JavaScript编程艺术-第8章-8.6.1-显示“缩略词语表”

    8.6.1-显示“缩略词语表” ***代码亲测可用*** HTML: JS: ***end***

  8. JavaScript取消默认控件并添加新控件(DOM编程艺术第11章)

    这一章实现的这个功能我研究了好久,这个思路我感觉已经是现在的我要膜拜的了,我感觉我的逻辑还是有些问题. 第一个问题:vid.height与vid.videoHeight vid.height = vi ...

  9. javascript DOM编程艺术 第10章问题记录

    为什么moveElement函数调用时,必须加字符串的拼接符 var repeat = "moveElement('"+elementID+"',"+final ...

随机推荐

  1. SVN 学习笔记-高级操作

    所谓高级操作,只是曲高和寡,其实都不怎么用的.但是关键时候,可能会很有用. 这个高级只是针对基本操作而言.有些操作可能也是比较基本的. 清除锁 有时候我们在操作的时候,可能系统崩溃了,或者SVN非正常 ...

  2. vue2.0单元测试(一)

    1.在vue init webpack XXX创建项目的时候 最后2步选择YES就启动了vue单元测试开始了   2.测试是使用karma+mocha框架来实现的方法,安装虚拟浏览器模块Phantom ...

  3. 百度统计的JS脚本原理解析

    一句话:在你的网站上加载百度统计的脚本,这个脚本会收集你的本地信息,然后发送给百度统计网站 https://blog.csdn.net/iqzq123/article/details/8877645 ...

  4. maven 的编译插件的配置

    原文: https://stackoverflow.com/questions/29258141/maven-compilation-error-use-source-7-or-higher-to-e ...

  5. apache下配置认证用户

    有时候我们须要给我apacheserver下制定的文件夹加上用户认证,方便一些而用户进行文件的浏览.配置例如以下: 1 设置用户 1 htpasswd -c file_path user_name 回 ...

  6. java 实现打印当前月份的日历

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcTc0NTQwMTk5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...

  7. javaEE之------ApectJ的切面技术===标签

    如今比較流行了aop技术之中的一个========标签 实现步骤: 一,导入aop标签 方法,打开aop包.里面就有. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5 ...

  8. MySQL 当记录不存在时插入,当记录存在时更新

    第一种: 示例一:插入多条记录 假设有一个主键为 client_id 的 clients 表,可以使用下面的语句: INSERT INTO clients (client_id,client_name ...

  9. 接口测试工具--Fiddler 的使用

    代码部分 Rules -> Customize Rules  打开Fiddler ScriptEditor,这里可以通过修改脚本中某些方法( OnBeforeRequest(oSession: ...

  10. 2016/2/29 html 思维导图