修改html中button显示的文字

时间:2022-01-19 13:48:06

1. <input type="button">  实现密码输入框的可见和隐藏

直接修改value属性即可

<script type="text/javascript">
function getPasswd(){
var passwd = document.getElementById("pwdID");
var pwdBtn = document.getElementById("pwdBtnID");
if(passwd.type=="password") {
passwd.type="text";
pwdBtn.value="隐藏";
}
else{
passwd.type="password";
pwdBtn.value="显示";
}
}
</script> 密码:<input id="pwdID" type="password">
<input id="pwdBtnID" type="button" onclick="getPasswd()" value="显示">

2. <button> 实现视频的播放和暂停

修改button的innerHTML

<script type="text/javascript">
function playVideo(){
var videoDiv = document.getElementById("videoId");
var videoBtn = document.getElementById("videoBtn");
if(videoDiv.paused){
videoDiv.play();
videoBtn.innerHTML = "暂停";
}
else{
videoDiv.pause();
videoBtn.innerHTML="播放";
}
}
</script> <button id="videoBtn" type="button" onclick="playVideo()">播放</button>

 3. innerHTML、innerText、outerHTML、outerText

innerHTML是符合W3C标准的属性,其它属性不推荐使用

下面是id=innerId的div几个值的对应结果

修改html中button显示的文字

修改html中button显示的文字的更多相关文章

  1. Android Studio 小技巧(2):AS中Button文字默认大写的问题

    问题类型 设置Layout中添加一个Button <Button android:id="@+id/bt_showerror" android:layout_width=&q ...

  2. iphone中button按钮显示为圆形解决

    iphone中button按钮显示为圆形解决: 添加样式: -webkit-appearance:button; 如果需要为直角: border-radius:0 在源码中添加如:style=&quo ...

  3. 动态更新Toolbar Menu以及Menu中同时显示文字和图标

    动态更新Toolbar Menu以及Menu中同时显示文字和图标 我们经常会有这样的需求,在切换Fragment或者点击某个按钮后动态更新Toolbar上Menu项.但是onCreateOptions ...

  4. jquery 中dataTable显示加载中,图片或文字

    引入js文件 <script type="text/javascript" src="${basePath}/lib/datatables/1.10.0/jquer ...

  5. Python3 tkinter基础 LabelFrame StringVar 单击按钮,Label中显示的文字更换

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  6. Button 在布局文件中定义监听器,文字阴影,自定义图片,代码绘制样式,添加音效的方法

    1.Button自己在xml文件中绑定监听器 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/andro ...

  7. 《Cocos2d-x游戏开发实战精解》学习笔记2--在Cocos2d-x中显示一行文字

    在Cocos2d-x中要显示文字就需要用到Label控件.在3.x版本的Cocos2d中,舍弃了之前版本所使用的LabelTTF.LabelAtlas.LabelBMFont 3个用于显示文字的类,而 ...

  8. C&num;&plus;OpenGL&plus;FreeType显示3D文字&lpar;1&rpar; - 从TTF文件导出字形贴图

    C#+OpenGL+FreeType显示3D文字(1) - 从TTF文件导出字形贴图 +BIT祝威+悄悄在此留下版了个权的信息说: 最近需要用OpenGL绘制文字,这是个很费时费力的事.一般的思路就是 ...

  9. WPF DatePicker只显示年和月 修改:可以只显示年

    最近的项目,查询时只需要年和月,不需要日,因此需要对原有的DatePicker进行修改,查询了网上的内容,最终从一篇帖子里看到了添加附加属性的方法,地址是http://*.co ...

随机推荐

  1. 【C&num;进阶系列】29 混合线程同步构造

    上一章讲了基元线程同步构造,而其它的线程同步构造都是基于这些基元线程同步构造的,并且一般都合并了用户模式和内核模式构造,我们称之为混合线程同步构造. 在没有线程竞争时,混合线程提供了基于用户模式构造所 ...

  2. markdown这么好用的东西我才知道。。。多么不折腾的我。。。

    markdown 锚点 努力吧 我的网站 之前有个域名phifan.com没续费被抢了,之后又买了phifan.cn没续费被抢了,还剩下个plusnet.cn说什么也不能再丢掉了! package c ...

  3. 设置emacs插件flycheck使用jslint eslint

    emacs的flycheck插件支持使用 jslint 和eslint   (setq flycheck-javascript-eslint-executable "~/.nvm/versi ...

  4. python3 split&lpar; &rpar; not enough values to unpack&lpar;expceted 2&comma; got 1&rpar;

    在运行一个小脚本时,脚本从一文本文件读取数据,事实上这个文件只有一行'count:2',并取到这个2,将其转成数字.但运行,总是报错. 代码如下: with open('count.txt', 'r' ...

  5. Yii入门教程

    1准备Yii源码 首先新建helloyii目录作为Web应用的根目录,并添加到Nginx的配置文件中.然后将Yii框架源码部署到helloyii下,目录结构如下: helloyii/ |-- fram ...

  6. &lpar;转&rpar;Android系统自带样式&lpar;&commat;android&colon;style&sol;&rpar;

    在AndroidManifest.xml文件的activity中配置 1.android:theme="@android:style/Theme" 默认状态,即如果theme这里不 ...

  7. 新浪研发中心&colon; Berkeley DB 使用经验总结

    http://blog.sina.com.cn/s/blog_502c8cc40100yqkj.html NoSQL是现在互联网Web2.0时代备受关注的技术之一,被用来存储大量的非关系型的数据.Be ...

  8. java volatile关键字的理解

    转载:http://shmilyaw-hotmail-com.iteye.com/blog/1672779 一个多线程的示例引发的问题 在讨论这个关键字之前先看一个多线程的示例代码: public c ...

  9. Python:删除、增加字典的元素

    一)增加一个或多个元素 d = {'a': 1}  d.update(b=2)  #也可以 d.update({‘b’: 2}) print(d) -->{'a': 1, 'b': 2}    ...

  10. js 时间格式与时间戳的相互转换和计算几天后的日期是哪一天

    //把日期转换成时间戳 function get_unix_time(time1){    var newstr = time1.replace(/-/g,'/');     var date =  ...