在HTML中改变input标签的内容

1.使用js自带的方法：

document.getElementById('roadName').value='武汉路';//通过标签选择器来选择标签，然后设置值

2.使用jQuery，需要引入jQuery，有两种方法

$('#roadName').attr('value','武汉路');//方法1

$('#roadName').val('武汉路');//方法2

//两种方法选择任意一种就可以了

完整的HTML代码

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

</head>

<body>

<input id="roadName" type="text" />

<script>

     document.getElementById('roadName').value='武汉路';

    // $('#roadName').attr('value','武汉路');

    // $('#roadName').val('武汉路');

</script>

</body>

</html>

在HTML中改变input标签中的内容的更多相关文章

  1. 改变input标签中placeholder显示的颜色

    ::-webkit-input-placeholder { /* WebKit browsers */ color: #A9A9A9; } :-moz-placeholder { /* Mozilla ...

  2. 控制input标签中只能输入数字以及小数点后两位

    js 代码如下: /* 控制input标签中只能输入数字 和小数点后两位 */ function checkNum(obj) { //检查是否是非数字值 if (isNaN(obj.value)) { ...

  3. input标签中的name

    <input>标签是java web的jsp页面中最常用的标签,特别是用来在页面和servlet中传递内容, 但是我们看到<input>标签中有很多内容,这边我们只提一下主要的 ...

  4. 关于django中input标签中file类型以及开路由

    0825自我总结 关于django中input标签中file类型 1.input提交图片实时展示 <img src="/static/img/default.png" wid ...

  5. php读取出字符串中的img标签中的图片路径

    php读取出字符串中的img标签中的图片路径 $pageContents = '字符串,带img标签'; $pageContents = str_replace('\"','"', ...

  6. 关于html中的 script标签中的 代码写法有效性? easyui tabs的href不能载入内容页面

    script标签, 即 html中的 js脚本区域中: 它其实就是一个 普通的 html标签, 在 html 渲染器 parser 看来, 它跟其他任何的普通 的 html标签 , 比如 p 标签, ...

  7. 如何在vue中修改动态标签中的样式和修改组件库样式

    vue中修改动态标签中的样式和修改组件库样式 因为vue中的标签在渲染的时候,都会给标签加上id 所以你想在<style lang="scss" scoped>直接修改 ...

  8. 使用CSS3中的input标签与lable标签组合实现banner图的切换

    在做网页时,我们经常可以碰到banner图的切换.对于那些JS薄弱的同学来说,这就很尴尬了.今天,我来告诉大家如何使用CSS做出banner图切换的效果. 这里,用到了lable标签与input的组合 ...

  9. [转]对form:input标签中的数字进行格式化

    原文地址:https://blog.csdn.net/qq_29662201/article/details/80708373 数字进行格式化(保留2位小数) 单独使用<fmt:formatNu ...

随机推荐

  1. Centos7路由设置

    再添加路由时,很多时候都是采用命令行用route添加的.但是在机器重启后.就失效了.这里也是参考了几位博主的经验 作出以下记载 一:路由表常用设置 1.route命令路由表常用设置: //添加到主机的 ...

  2. CentOS8 部署SqlServer

    官方文档https://docs.microsoft.com/zh-cn/sql/linux/quickstart-install-connect-red-hat?view=sql-server-li ...

  3. 【命令】top命令

    功用: <---实时动态地查看系统的整体运行情况,两个命令都是查看运行状况,但是htop更加易用---> TOP是一个动态显示过程,即可以通过用户按键来不断刷新当前状态.如果在前台执行该命 ...

  4. 常见编译器EOP

    delphi:  55            PUSH EBP  8BEC          MOV EBP,ESP  83C4 F0       ADD ESP,-10  B8 A86F4B00  ...

  5. Linux内核源码分析之setup_arch (三)

    1. 前言 在 Linux内核源码分析之setup_arch (二) 中介绍了当前启动阶段的内存分配函数memblock_alloc,该内存分配函数在本篇将要介绍paging_init中用于页表和内存 ...

  6. 技术基础 | 监测Apache Cassandra的简明方式——MCAC

    点击这里在GitHub上访问我们,以便深入了解DataStax的开源项目--Apache Cassandra指标收集器(Metric Collector for Apache Cassandra, o ...

  7. 浅入kubernetes(2)：Kubernetes 的组成

    目录 说明 Kubernetes集群的组成 What are containerized applications? What are Kubernetes containers? What are ...

  8. 对HTTP请求接口资源下载时间过长的问题分析

    问题描述 我司某产品线有指定业务接口customQuery在线上环境中,与首页一起打开时下载数据的时间明显过长(平均可以达到2s) 注: "与首页一起打开" 的含义是指用户进入WE ...

  9. SpringBoot 集成Elasticsearch进行简单增删改查

    一.引入的pom文件 <?xml version="1.0" encoding="UTF-8"?> <project xmlns=" ...

  10. Docker环境下升级PostgreSQL

    查阅PostgreSQL官方文档可以得知,官方提供了两种方式对数据库进行升级--pg_dumpall与pg_upgrade. pg_dumpall是将数据库转储成一个脚本文件,然后在新版数据库中可以直 ...