编程

白天 夜间 首页 下载 阅读记录
  我的书签   添加书签   移除书签

JS - 简单的网页交互

浏览 201 扫码 分享 2023-03-31 09:04:56
  • 交互方式
    • 1、弹出窗体显示内容
    • 2、控制台打印(常用)
    • 3、内容以html标签的方式显示
    • 4、接收用户输入内容

    交互方式

    1、弹出窗体显示内容

    image.png
    可以在调试工具的console里面输入代码,如:
    image.png

    2、控制台打印(常用)

    image.png
    HBuildX快捷输入:clog

    3、内容以html标签的方式显示

    image.png

    4、接收用户输入内容

    image.png

    若有收获,就点个赞吧

    0 人点赞

    上一篇:
    下一篇:
    • 书签
    • 添加书签 移除书签
    • 工具
      • 编辑器
      • 命令行
        • DOS
      • 版本控制
        • SVN
          • SVN-01.介绍
          • SVN-02.安装
          • SVN-03.搭建服务器
          • SVN-04.配置客户端
          • SVN-05.提交修改
        • Git
          • Git-01.介绍
          • Git-02.安装
          • Git-03.操作
          • Git-04.远程仓库
          • Git-05.分支
      • 包管理工具
        • 包管理工具 - 总览
        • 包管理工具 - NPM
        • 包管理工具 - Yarn
        • 包管理工具 - cnpm
    • 服务器
      • Nginx 代理服务器
    • 前端
      • HTML
        • HTML-01.介绍
        • HTML-02.结构
        • HTML-03.文本标签
        • HTML-04.媒体标签
        • HTML-05.字符实体
        • HTML-06.容器
        • HTML-07.列表
        • HTML-08.表格
        • HTML-09.表单
        • HTML-10.元素类型
      • CSS
        • CSS-01.介绍
        • CSS-02.选择器
        • CSS-03.属性
        • CSS-04.Emmet语法
        • CSS模块
          • CSS - SASS
          • CSS - LESS
      • JavaScript
        • JS - 介绍
        • JS - 基础
          • JS - Html中编写和运行
          • JS - 简单的网页交互
          • JS - 基本语法
          • JS - 变量
          • JS - 数据类型
          • JS - 运算符
          • JS - 流程控制
          • JS - 数组 Array
          • JS - 对象 Object
        • JS - 高级进阶
          • JS - 严格模式
          • JS - 函数 function
            • JS - 函数 - this 与 箭头函数
            • JS - 函数 - 纯函数 & 柯理化 & 组合函数
            • JS - 函数 - with / eval
          • JS - 浏览器工作原理 / V8引擎 / 内存管理
          • JS - 面向对象编程
            • JS - 内置对象
            • JS - 原型 prototype 及 原型链
            • JS - 对象的继承方案
            • JS - 原型与继承的一些方法
            • JS - 类 class
          • JS - 集合 Set (ES6)
          • JS - 弱集合 WeakSet (ES6)
          • JS - 映射 Map (ES6)
          • JS - 弱映射 WeakMap (ES6)
          • JS - 对象弱引用 WeakRef(ES12)
          • JS - 代理 Proxy (ES6)
          • JS - 反射 Reflect (ES6)
          • JS - 期约 Promise(ES6)
          • JS - 迭代器 iterator(ES6)
          • JS - 生成器 Generator(ES6)
          • JS - 异步函数 async/await (ES8)
          • JS - JS线程 / 事件循环
          • JS - 错误处理与调试
          • JS - 模块化*
          • JS - JSON
        • JS - Web开发
          • JS - 媒体类型(MIME)
          • JS - 浏览器对象模型 BOM
          • JS - 文档对象模型 DOM
            • JS - 操作DOM
            • JS - DOM编程
            • JS - 观察DOM元素变化接口
            • JS - DOM扩展
            • JS - WEB组件
          • JS - 事件监听
          • JS - 客户端储存 Storage
          • JS - 客户端检测
          • JS - 动画与Canvas 图形
          • JS - 表单脚本
          • JS - 网络请求与远程资源.
            • JS - XMLHttpRequest 对象
            • JS - 浏览器 同源策略 & 跨域
        • JS - JS API
          • JS - 文件API
          • JS - Streams 流API
          • JS - 媒体元素
          • JS - 原生拖放
          • JS - 通知API
          • JS - 页面隐藏API
          • JS - 性能 API
          • JS - 密码学API
        • JS - 工具函数
          • JS - 自定义深拷贝
          • JS - 防抖 与 节流
          • JS - 事件总线
          • JS - 浏览器指纹(设备id)
        • JS - 最佳实践
        • JS - 工作者线程
      • TypeScript
        • TS - 背景、TS、发展趋势
        • TS - 编译环境、运行环境
        • TS - 类型
          • TS - 类型Type
          • TS - 类型的选项
          • TS - 内置类型函数
        • TS - 模块化开发
        • TS - 面向对象编程
        • TS - 声明文件 和 代码提示
        • TS - 项目使用第三方库
        • TS - 配置文件tsconfig.json
      • Vue
        • Vue - 介绍
        • Vue - 引入、安装(Vue3)
        • Vue - 编程模式
        • Vue - 基本属性
        • Vue - 内容显示语法
        • Vue-指令
          • 绑定属性
            • *Vue - v-bind 绑定html元素属性
          • 显示/渲染
            • Vue - v-once 只渲染一次
            • Vue - v-text 插入文本
            • Vue - v-html 插入html代码
            • Vue - v-pre 不编译显示
            • Vue - v-cloak 加载完成后再渲染
            • Vue - v-if 是否加载
            • Vue - v-show 是否显示
          • 循环
            • Vue - v-for 循环
          • 事件
            • Vue - v-on 事件
          • 表单
            • Vue - v-model 表单属性绑定
          • 选择
            • Vue-ref 引用
        • Vue-选项
          • 数据
            • Vue - computed 计算属性
            • Vue - watch 监听变化
          • 资源
            • Vue - filters 过滤器(Vue3 废弃)
        • Vue - 编写Template的3种方式(Vue3)
        • Vue - 在webpack里使用Vue3
        • Vue - Vue CLI 脚手架
        • Vue - components 组件
          • Vue - 组件通信(父子组件Props,Emits)
          • Vue - 组件通信(非父子组件)
          • Vue - 动态组件 及 keep-alive组件缓存
          • Vue - 异步组件
        • Vue - slot 插槽(重要)
        • Vue - 生命周期
        • Vue - v-model 组件双向绑定
        • Vue - 动画
        • Vue 3.0
          • Vue 3 - 组合API (compostition API)
          • Vue 3 - 组合API 语法糖(简写)
          • Vue 3 - CSS 语法糖
          • Vue 3 - setup 执行原理
        • 代码复用
          • Vue - 全局函数 globalProperties
          • Vue - Mixin 混入 / extends 继承
          • Vue 3 - 渲染函数 和 JSX
          • Vue 3 - 外部Hook函数
          • Vue - 自定义指令
          • Vue 3 - Teleport 组件跨app挂载
          • Vue - 插件
        • Vue-Vue Router 路由
          • Vue Router - 页面路由属性 route
          • Vue Router - 路由跳转对象 router
          • Vue Router - <router-link> 标签属性
        • Vue-Vuex 公共变量管理
          • Vuex - 1、创建状态仓库(Store对象)
          • Vuex - 2、引入 & 使用
          • Vuex - 3、计算属性 getters
          • Vuex - 4、(同步)修改变量 mutations
          • Vuex - 5、(异步)修改变量 actions
          • Vuex - 6、分模块modules
          • Vue-Devtools Vue浏览器插件
        • Vue - nexttick 等待下次DOM更新
        • Vue 模块
          • Vue-avue UI框架
        • Vue 3 - TS中使用
        • Vue - 单元测试
        • Vue - 生态
        • Vue - 学习源码
      • 前端打包工具
        • Webpack
          • Webpack - 安装
          • Webpack - Loader 加载器
          • Webpack - Plugin 插件
          • Webpack - 自动编译、本地开发服务器
        • Vue - Vue Cli 脚手架
        • Vite
      • Web项目
        • 项目管理
          • 项目 - 代码规范
          • 项目 - 规范、流程
          • 流程
          • 原型工具 - Axure
        • 组件库
          • Avue-Cli
            • Avue登录流程
            • Avue Cli 骨架屏
            • Avue-Cli 基本公共-public
            • Avue-Cli 图标库
            • Avue Cli 表格crud
            • Avue-Cli 路由
              • Avue-Cli 基本网页设置
              • Avue-Cli 登录
              • Avue-Cli 主页
          • element-plus
        • 项目 - 项目描述
        • 项目 - 环境变量
        • 项目 - 获取网络请求数据
        • 项目 - 模块、插件
          • vue.draggable 拖拽组件
          • 项目 - 地址JSON库
          • 生成背景
          • Pinia - 类似Vuex的库
          • normalize.css 全局初始化样式
          • gsap - JS动画库
          • Animate.css 动画
          • axios 网络请求
          • Babel - 转换代码
          • QuickType - 根据JSON快速生成声明
          • Js-cookie 操作cookie
          • cdn加速-jsdelivr
          • NodeMailer 后端发送邮件
          • svg-captcha 图形验证码
          • CryptoJS 加密解密
          • Vue - 导入/导出表格
            • ExcelJS - 工作表 WorkSheet
            • ExcelJS - 列 column
            • ExcelJS - 行 row
            • ExcelJS - 单元格 cell
            • ExcelJS - 表格 table
            • ExcelJS - 样式
          • Vue- Gzip 压缩
          • QRcode 二维码
          • 项目 - 数据可视化图表
          • Vue-element UI框架
          • mockjs 模拟后端
          • Apite 模拟后端(Vite)
        • 项目 - 登录
        • 项目 - 权限控制
        • 项目 - 标签页tab
        • 项目 - 菜单/标签页
        • 项目 - 缓存页面 keepalive
        • 项目 - 图标icon
        • 项目 - 网络字体
        • 项目 - 正则表达式 Regxp
        • 项目 - 路径url
        • web-通用组件
          • web-底部导航栏TabBar
        • 项目 - 优化
        • 项目 - 项目打包和自动化部署
        • 项目 - 授权(OAuth 2.0)
        • Jeecg 后台管理系统
    • Uni-App、小程序、H5 App
      • 小程序
        • Uni-App
          • Uni-App - 介绍
          • Uni-App - 安装/运行
          • Uni-App - 页面 & 路由跳转
          • Uni-App - 生命周期
          • Uni-App - 组件化开发
            • Uni-App - 内置组件
          • Uni-App - 全局
          • Uni-App - 配置
        • 钉钉小程序
          • 钉钉 - 企业内部应用
      • APP
        • 5 APP
          • h5 App - 介绍/开发
          • h5 App - 打包
      • uniCloud
        • uniCloud - 介绍
        • UniCloud - 服务空间 及 功能
          • uniCloud - 功能1:云函数
          • uniCloud - 功能2:云数据库
          • uniCloud - 功能3:云储存
          • uniCloud - 功能4:前端网页托管
        • uniCloud - 创建UniCloud项目
        • UniCloud 模块
          • UniCloud模块 - Uni-captcha 图形验证码
          • UniCloud模块 - Uni-config-center 配置中心
          • UniCloud模块 - Uni-id
          • UniCloud模块 - Uni-Starter
    • 后端
      • NodeJS
        • Nodejs-01 基本介绍
        • Nodejs-02 模块/包
        • Nodejs-03 连接数据库
        • Nodejs-04 创建服务器
        • Nodejs- eggjs框架
          • Nodejs - egg - Cookie 和 Session
      • C#
        • 基础
          • C# - 介绍
      • 数据库
        • 数据库-概念
        • Redis
          • Redis-简介
        • MySQL
          • MySQL-介绍
          • MySQL-安装
          • MySQL-登录
          • MySQL-字符集
          • MySQL-SQL语句
      • Java
      • PHP
        • PHP-MySQL
        • PHP-环境搭建
      • Python
        • Python-编辑器IDE
        • Python-01.安装
        • Python-02.编译
        • Python-03.变量
        • Python-04.数据类型
        • Python-05.判断
        • Python-06.循环
        • Python-07.引入模块
        • Python-08.类、对象、函数、模块、异常
        • Python-09.爬虫
    • 桌面应用
    • 算法
      • 算法 - 基本介绍
    暂无相关搜索结果!

      让时间为你证明

      展开/收起文章目录

      分享,让知识传承更久远

      文章二维码

      手机扫一扫,轻松掌上读

      文档下载

      请下载您需要的格式的文档,随时随地,享受汲取知识的乐趣!
      PDF文档 EPUB文档 MOBI文档

      书签列表

        阅读记录

        阅读进度: 0.00% ( 0/0 ) 重置阅读进度

          思维导图备注