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


Posted in Javascript onOctober 20, 2014

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

str_object.sup()

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

sup 方法实例:

<script language="JavaScript">

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

</script>

运行该例子,输出:

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

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

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

<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 MVC 样式框架
Mar 24 Javascript
JS实现的简洁纵向滑动菜单(滑动门)效果
Oct 19 Javascript
JavaScript观察者模式(publish/subscribe)原理与实现方法
Mar 30 Javascript
js学习总结_轮播图之渐隐渐现版(实例讲解)
Jul 17 Javascript
js实现移动端导航点击自动滑动效果
Jul 18 Javascript
jQuery+CSS实现的table表格行列转置功能示例
Jan 08 jQuery
详解node.js中的npm和webpack配置方法
Jan 21 Javascript
vue 父组件给子组件传值子组件给父组件传值的实例代码
Apr 15 Javascript
微信小程序自定义多列选择器使用详解
Jun 21 Javascript
Vue3.0数据响应式原理详解
Oct 09 Javascript
vue 解决form表单提交但不跳转页面的问题
Oct 30 Javascript
JS highcharts实现动态曲线代码示例
Oct 16 Javascript
iframe里面的元素触发父窗口元素事件的jquery代码
Oct 19 #Javascript
js添加select下默认的option的value和text的方法
Oct 19 #Javascript
使用变量动态设置js的属性名
Oct 19 #Javascript
js控制鼠标事件移动及移出效果显示
Oct 19 #Javascript
js读取json的两种常用方法示例介绍
Oct 19 #Javascript
Jquery解析Json格式数据过程代码
Oct 17 #Javascript
jQuery实现点击该行即可删除HTML表格行
Oct 17 #Javascript
You might like
php读取javascript设置的cookies的代码
2010/04/12 PHP
基于Linux调试工具strace与gdb的常用命令总结
2013/06/03 PHP
php json转换成数组形式代码分享
2014/11/10 PHP
php求一个网段开始与结束IP地址的方法
2015/07/09 PHP
Thinkphp 中 distinct 的用法解析
2016/12/14 PHP
实现png图片和png背景透明(支持多浏览器)的方法
2009/09/08 Javascript
再谈ie和firefox下的document.all属性
2009/10/21 Javascript
基于jquery的表头固定的若干方法
2011/01/27 Javascript
深入理解JS中的变量及作用域、undefined与null
2014/03/04 Javascript
jquery实现简单的轮换出现效果实例
2015/07/23 Javascript
JQuery+Ajax实现数据查询、排序和分页功能
2015/09/27 Javascript
js操作cookie保存浏览记录的方法
2015/12/25 Javascript
Angularjs实现分页和分页算法的示例代码
2016/12/23 Javascript
Vue.js实现多条件筛选、搜索、排序及分页的表格功能
2020/11/24 Javascript
关于Javascript中document.cookie的使用
2017/03/08 Javascript
JS 插件dropload下拉刷新、上拉加载使用小结
2017/04/13 Javascript
通过nodejs 服务器读取HTML文件渲染到页面的方法
2018/05/17 NodeJs
angularJs复选框checkbox选中进行ng-show显示隐藏的方法
2018/10/08 Javascript
基于vue开发微信小程序mpvue-docs跳转页面功能
2019/04/10 Javascript
javascript实现蒙版与禁止页面滚动
2020/01/11 Javascript
python执行子进程实现进程间通信的方法
2015/06/02 Python
对numpy中向量式三目运算符详解
2018/10/31 Python
使用Python对Dicom文件进行读取与写入的实现
2020/04/20 Python
PyQt5中QSpinBox计数器的实现
2021/01/18 Python
python使用scapy模块实现ping扫描的过程详解
2021/01/21 Python
Python爬虫回测股票的实例讲解
2021/01/22 Python
matplotlib相关系统目录获取方式小结
2021/02/03 Python
全球知名提供各类营养保健品的零售商:Vitamin Shoppe
2016/10/09 全球购物
介绍一下SOA和SOA的基本特征
2016/02/24 面试题
药品促销活动方案
2014/02/14 职场文书
聘任书模板
2014/03/29 职场文书
升学宴主持词
2014/04/02 职场文书
大学同学会活动方案
2014/08/20 职场文书
弘扬焦裕禄精神践行三严三实心得体会
2014/10/13 职场文书
2015年“公民道德宣传日”活动方案
2015/05/06 职场文书
2016年端午节校园广播稿
2015/12/18 职场文书