当前位置: 首页 > news >正文

js基础

1 事件触发、调用js函数

onclick是点击触发事件

在function里会有js代码,这里改变的是文本,其他html元素也可以改变

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script>
        function f() {                                    //脚本函数
            x = document.getElementById('show_time')    //根据id查找内容
            x.innerHTML=Date();                           //改变显示内容
        }
    </script>
</head>
<body>

    <div>
        <p id="show_time">原内容</p>
        <button type="button" οnclick="f()">显示日期</button>
{#        一个按钮,点击触发onclick事件,调用脚本函数#}
    </div>

</body>
</html>

  

 2 对象

person是一个类,firstname和lastname是它的属性,而fullname是方法。

在showname函数中,调用了person.fullname()这个方法。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script>

        var person = {
            firstName: "John",
            lastName : "Doe",
            id : 5566,
            fullName : function()
            {
               return this.firstName + " " + this.lastName;
            }
        };

        function showName() {
            document.getElementById('myName').innerHTML = person.fullName()
        }
    </script>
</head>
<body>

    <div>
        <p id="myName"></p>
        <button type="button" οnclick="showName()">show name</button>
    </div>

</body>
</html>

  

转载于:https://www.cnblogs.com/jabbok/p/10405004.html

相关文章:

  • 前嗅ForeSpider教程:创建模板
  • spring cloud构建互联网分布式微服务云平台-SpringCloud集成项目简介
  • MySQL无法启动几种常见问题小结
  • C语言笔记(第一章:C语言编程)
  • sqoop使用手册--mysql配置
  • width 值 max-content、fill-available、min-content 对应作用
  • multimap详讲
  • 剑指offer-树的子结构
  • JavaScript HTML DOM
  • js提交表单错误:document.form.submit() is not a function
  • React as a UI Runtime(五、列表)
  • 如何进阶一名有竞争力的程序员?
  • 实现简单的正则表达式引擎
  • 读写配置文件模块configparser—参考杨永明博客
  • Android的WIFI局域网对讲机
  • “大数据应用场景”之隔壁老王(连载四)
  • 【刷算法】从上往下打印二叉树
  • 2017 年终总结 —— 在路上
  • 2017届校招提前批面试回顾
  • JavaScript 一些 DOM 的知识点
  • Javascript编码规范
  • js作用域和this的理解
  • maven工程打包jar以及java jar命令的classpath使用
  • Rancher如何对接Ceph-RBD块存储
  • Web设计流程优化:网页效果图设计新思路
  • weex踩坑之旅第一弹 ~ 搭建具有入口文件的weex脚手架
  • Windows Containers 大冒险: 容器网络
  • 不用申请服务号就可以开发微信支付/支付宝/QQ钱包支付!附:直接可用的代码+demo...
  • 普通函数和构造函数的区别
  • 视频flv转mp4最快的几种方法(就是不用格式工厂)
  • 微信如何实现自动跳转到用其他浏览器打开指定页面下载APP
  • 吴恩达Deep Learning课程练习题参考答案——R语言版
  • 小程序滚动组件,左边导航栏与右边内容联动效果实现
  • media数据库操作,可以进行增删改查,实现回收站,隐私照片功能 SharedPreferences存储地址:
  • puppet连载22:define用法
  • 国内唯一,阿里云入选全球区块链云服务报告,领先AWS、Google ...
  • #Linux(Source Insight安装及工程建立)
  • #NOIP 2014# day.2 T2 寻找道路
  • #stm32整理(一)flash读写
  • $(document).ready(function(){}), $().ready(function(){})和$(function(){})三者区别
  • ${ }的特别功能
  • (1)(1.19) TeraRanger One/EVO测距仪
  • (4) openssl rsa/pkey(查看私钥、从私钥中提取公钥、查看公钥)
  • (4)事件处理——(6)给.ready()回调函数传递一个参数(Passing an argument to the .ready() callback)...
  • (Redis使用系列) Springboot 实现Redis 同数据源动态切换db 八
  • (十五)使用Nexus创建Maven私服
  • (四) Graphivz 颜色选择
  • (一)eclipse Dynamic web project 工程目录以及文件路径问题
  • (转)四层和七层负载均衡的区别
  • .a文件和.so文件
  • .gitignore文件—git忽略文件
  • .NET 6 在已知拓扑路径的情况下使用 Dijkstra,A*算法搜索最短路径
  • .NET CF命令行调试器MDbg入门(二) 设备模拟器
  • .NET Core 控制台程序读 appsettings.json 、注依赖、配日志、设 IOptions
  • .Net Core和.Net Standard直观理解