JavaScript sub方法入门实例(把字符串显示为下标)


Posted in Javascript onOctober 17, 2014

JavaScript sub 方法

sub 方法返回使用 HTML sub 标签属性定义的下标字符串。其语法如下:

str_object.sub()

提示:该方法不符合 ECMA 标准,不建议使用。

sub 方法实例

<script language="JavaScript">

document.write( '三水点靠木' + '每一点进步,都是我们通往成功道路上的坚实脚印'.sub() );

</script>

运行该例子,输出:

三水点靠木每一点进步,都是我们通往成功道路上的坚实脚印

提示:该方法返回使用 HTML sub 标签定义的下标字符串,即使用该方法并不能直接将字符串变更为下标样式。如果想动态改变元素字体为下标样式,可参考下面的实例:

改变字体文本上下对齐方式(上标/下标)

<html>

<script language="JavaScript">

function changFont( x ){

    document.getElementById("sub_title").style.verticalAlign = x;

}

</script>

<body>

<p>

<a onClick="changFont('sub');">下标样式</a> <a onClick="changFont('super');">上标样式</a>

</p>

<p>

三水点靠木<span id="sub_title">每一点进步,都是我们通往成功道路上的坚实脚印</span>

</p>

</body>

</html>

在该例子中,通过 JavaScript 控制文本 CSS vertical-align 样式的方式,来动态改变字体文本的上下对齐方式(上标/下标)。

Javascript 相关文章推荐
jQuery 第二课 操作包装集元素代码
Mar 14 Javascript
javascript 学习笔记(一)DOM基本操作
Apr 08 Javascript
js 函数的副作用分析
Aug 23 Javascript
Jvascript学习实践案例(开发常用)
Jun 25 Javascript
Javascript实现获取窗口的大小和位置代码分享
Dec 04 Javascript
jquery通过load获取文件的内容并跳到锚点的方法
Jan 29 Javascript
Jquery数字上下滚动动态切换插件
Aug 08 Javascript
最丑的时钟效果!js canvas时钟制作方法
Aug 15 Javascript
小程序开发实战:实现九宫格界面的导航的代码实现
Jan 19 Javascript
js实现年月日表单三级联动
Apr 17 Javascript
JS实现基于Sketch.js模拟成群游动的蝌蚪运动动画效果【附demo源码下载】
Aug 18 Javascript
一篇文章让你搞懂JavaScript 原型和原型链
Nov 23 Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
Oct 17 #Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 #Javascript
JavaScript italics方法入门实例(把字符串显示为斜体)
Oct 17 #Javascript
JavaScript fontsize方法入门实例(按照指定的尺寸来显示字符串)
Oct 17 #Javascript
JavaScript fontcolor方法入门实例(按照指定的颜色来显示字符串)
Oct 17 #Javascript
JavaScript bold方法入门实例(把指定文字显示为粗体)
Oct 17 #Javascript
JavaScript lastIndexOf方法入门实例(计算指定字符在字符串中最后一次出现的位置)
Oct 17 #Javascript
You might like
一次编写,随处运行
2006/10/09 PHP
php 获取远程网页内容的函数
2009/09/08 PHP
PHP验证码类代码( 最新修改,完全定制化! )
2010/12/02 PHP
window+nginx+php环境配置 附配置搭配说明
2010/12/29 PHP
ThinkPHP模板判断输出Present标签用法详解
2014/06/30 PHP
PHP伪造来源HTTP_REFERER的方法实例详解
2015/07/06 PHP
PHP+Ajax验证码验证用户登录
2016/07/20 PHP
PHP折半(二分)查找算法实例分析
2018/05/12 PHP
JQuery 动态扩展对象之另类视角
2010/05/25 Javascript
angularJS与bootstrap结合实现动态加载弹出提示内容
2015/10/16 Javascript
jQuery上传插件webupload使用方法
2017/08/01 jQuery
vue-ajax小封装实例
2017/09/18 Javascript
vue实现点击展开点击收起效果
2018/04/27 Javascript
vue组件name的作用小结
2018/05/23 Javascript
vue.js使用watch监听路由变化的方法
2018/07/08 Javascript
vue 中url 链接左边的小图标更改问题
2019/12/30 Javascript
node.js 如何监视文件变化
2020/09/01 Javascript
node.js通过url读取文件
2020/10/16 Javascript
[01:45]IMBATV TI4前线报道-选手到达
2014/07/07 DOTA
python变量不能以数字打头详解
2016/07/06 Python
python实现rsa加密实例详解
2017/07/19 Python
Django rest framework基本介绍与代码示例
2018/01/26 Python
Pyinstaller 打包exe教程及问题解决
2019/08/16 Python
python3中关于excel追加写入格式被覆盖问题(实例代码)
2020/01/10 Python
opencv中图像叠加/图像融合/按位操作的实现
2020/04/01 Python
Python使用urlretrieve实现直接远程下载图片的示例代码
2020/08/17 Python
Python中Pyspider爬虫框架的基本使用详解
2021/01/27 Python
人力资源专员岗位职责
2014/01/30 职场文书
护林防火标语
2014/06/27 职场文书
中职毕业生自我鉴定
2014/09/13 职场文书
培根随笔读书笔记
2015/07/01 职场文书
Go语言 go程释放操作(退出/销毁)
2021/04/30 Golang
为什么mysql字段要使用NOT NULL
2021/05/13 MySQL
如何给HttpServletRequest增加消息头
2021/06/30 Java/Android
基于Redis的List实现特价商品列表功能
2021/08/30 Redis
使用python求解迷宫问题的三种实现方法
2022/03/17 Python