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 相关文章推荐
javascript this用法小结
Dec 19 Javascript
js使用正则实现ReplaceAll全部替换的方法
Aug 22 Javascript
JS控制伪元素的方法汇总
Apr 06 Javascript
jQuery实现内容定时切换效果完整实例
Apr 06 Javascript
Bootstrap模态框使用详解
Feb 15 Javascript
使用原生js写ajax实例(推荐)
May 31 Javascript
JavaScript中使用参数个数实现重载功能
Sep 01 Javascript
Vue.js项目模板搭建图文教程
Sep 20 Javascript
原生js实现Flappy Bird小游戏
Dec 24 Javascript
微信小程序canvas开发水果老虎机的思路详解
Feb 07 Javascript
如何利用JavaScript编写更好的条件语句详解
Aug 10 Javascript
JavaScript中EventBus实现对象之间通信
Oct 18 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
php函数之子字符串替换&amp;#65279; str_replace
2011/03/23 PHP
PHP如何通过AJAX方式实现登录功能
2015/11/23 PHP
php二维数组按某个键值排序的实例讲解
2019/02/15 PHP
PHP的图像处理实例小结【文字水印、图片水印、压缩图像等】
2019/12/20 PHP
laravel框架使用FormRequest进行表单验证,验证异常返回JSON操作示例
2020/02/18 PHP
JS解析json数据并将json字符串转化为数组的实现方法
2012/12/25 Javascript
js跑马灯代码(自写)
2013/04/17 Javascript
css样式标签和js语法属性区别
2013/11/06 Javascript
jquery解析xml字符串示例分享
2014/03/25 Javascript
JavaScript window.location对象
2014/11/14 Javascript
jquery性能优化高级技巧
2015/08/24 Javascript
Bootstrap3学习笔记(二)之排版
2016/05/20 Javascript
详解Vue.js动态绑定class
2016/12/20 Javascript
AngularJS页面传参的5种方式
2017/04/01 Javascript
浅谈vue-cli 3.0.x 初体验
2018/04/11 Javascript
微信小程序动态生成二维码的实现代码
2018/07/25 Javascript
jQuery 查找元素操作实例小结
2019/10/02 jQuery
vue(2.x,3.0)配置跨域代理
2019/11/27 Javascript
Vue + Node.js + MongoDB图片上传组件实现图片预览和删除功能详解
2020/04/29 Javascript
[03:08]TI9战队档案 - Vici Gaming
2019/08/20 DOTA
python用ConfigObj读写配置文件的实现代码
2013/03/04 Python
Pandas 同元素多列去重的实例
2018/07/03 Python
python通过TimedRotatingFileHandler按时间切割日志
2019/07/17 Python
python 动态迁移solr数据过程解析
2019/09/04 Python
tensorflow 环境变量设置方式
2020/02/06 Python
翻转数列python实现,求前n项和,并能输出整个数列的案例
2020/05/03 Python
荷兰时尚精品店:Labels Fashion
2020/03/22 全球购物
用你熟悉的语言写一个连接ORACLE数据库的程序,能够完成修改和查询工作
2012/06/11 面试题
《去年的树》教学反思
2014/04/11 职场文书
2014年教师节座谈会发言稿
2014/09/10 职场文书
医院党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
元宵节寄语大全
2015/02/27 职场文书
2016年学校爱国卫生月活动总结
2016/04/06 职场文书
廉政党课工作报告案例
2019/06/21 职场文书
利用python进行数据加载
2021/06/20 Python
Element实现动态表格的示例代码
2021/08/02 Javascript