JavaScript字符串对象(string)基本用法示例


Posted in Javascript onJanuary 18, 2017

本文实例讲述了JavaScript字符串对象(string)基本用法。分享给大家供大家参考,具体如下:

1.获取字符串的长度:

var s = "Hello world";
document.write("length:"+s.length);

2.为字符串添加各种样式,如:

var txt = "Some words";
document.write("<p>Big: " + txt.big() + "</p>")
document.write("<p>Small: " + txt.small() + "</p>")
document.write("<p>Bold: " + txt.bold() + "</p>")
document.write("<p>Italic: " + txt.italics() + "</p>")
document.write("<p>Blink: " + txt.blink() + " (does not work in IE)</p>")
document.write("<p>Fixed: " + txt.fixed() + "</p>")
document.write("<p>Strike: " + txt.strike() + "</p>")
document.write("<p>Fontcolor: " + txt.fontcolor("Red") + "</p>")
document.write("<p>Fontsize: " + txt.fontsize(16) + "</p>")
document.write("<p>Link: " + txt.link("https://3water.com") + "</p>")

3.获取字符串中部分内容首次出现的位置:

var hw_text = "Hello world";
document.write(hw_text.indexOf("Hello")+"<br/>");
document.write(hw_text.indexOf("world")+"<br/>");
document.write(hw_text.indexOf("abc")+"<br/>");

4.内容替换:

var str="Visit Microsoft!"
document.write(str.replace(/Microsoft/,"W3School"))

效果图:

JavaScript字符串对象(string)基本用法示例

示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-cn" />
<title>Javascript 字符串对象</title>
<head>
 <style>
  body {background-color:#e6e6e6}
 </style>
</head>
<body>
 <h3>(一)length属性:获取字符串的长度</h3>
 <p id="hw">Hello world, Hello javascript!</p>
 <script>
  var s = document.getElementById("hw").innerHTML;
  document.write("length:"+s.length);
 </script>
 <h3>(二)为字符串添加样式</h3>
 <p>对字符串调用样式的相关方法时,会自动拼接相应的html标签</p>
 <p id = "hw_02">some words</p>
 <button onclick="alertBig()">Call txt.big()</button>
 <script>
  var txt = document.getElementById("hw_02").innerHTML;
  document.write("<p>Big: " + txt.big() + "</p>")
  document.write("<p>Small: " + txt.small() + "</p>")
  document.write("<p>Bold: " + txt.bold() + "</p>")
  document.write("<p>Italic: " + txt.italics() + "</p>")
  document.write("<p>Blink: " + txt.blink() + " (does not work in IE)</p>")
  document.write("<p>Fixed: " + txt.fixed() + "</p>")
  document.write("<p>Strike: " + txt.strike() + "</p>")
  document.write("<p>Fontcolor: " + txt.fontcolor("Red") + "</p>")
  document.write("<p>Fontsize: " + txt.fontsize(16) + "</p>")
  document.write("<p>Link: " + txt.link("https://3water.com") + "</p>")
  function alertBig(){
   alert(txt.big());
  }
 </script>
 <h3>(三)indexOf方法:定位字符串中某一个指定的字符首次出现的位置</h3>
 <script>
  var hw_text = "Hello world";
  document.write(hw_text.indexOf("Hello")+"<br/>");
  document.write(hw_text.indexOf("world")+"<br/>");
  document.write(hw_text.indexOf("abc")+"<br/>");
 </script>
 <h3>(四)replace()方法:替换字符串中的部分内容</h3>
 <script>
  var str="Visit Microsoft!"
  document.write(str.replace(/Microsoft/,"3water"))
 </script>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript Array数组对象的扩展函数代码
May 22 Javascript
Javascript面向对象编程(二) 构造函数的继承
Aug 28 Javascript
使用jQuery获得内容以及内容的属性
Feb 26 Javascript
AngularJS 使用$sce控制代码安全检查
Jan 05 Javascript
jsp 网站引入外部css或者js失效问题解决
Oct 31 Javascript
js遍历获取表格内数据的方法(必看)
Apr 06 Javascript
温故知新——JavaScript中的字符串连接问题最全总结(推荐)
Aug 21 Javascript
ES6中Array.includes()函数的用法
Sep 20 Javascript
JavaScript插件Tab选项卡效果
Nov 14 Javascript
Vue不能观察到数组length的变化
Jun 08 Javascript
浅谈Vue数据响应
Nov 05 Javascript
JavaScript跳出循环的三种方法(break, return, continue)
Jul 30 Javascript
Vue.js自定义指令的用法与实例解析
Jan 18 #Javascript
vue.js+Element实现表格里的增删改查
Jan 18 #Javascript
JS中Array数组学习总结
Jan 18 #Javascript
原生javascript实现图片放大镜效果
Jan 18 #Javascript
jQuery Validation Engine验证控件调用外部函数验证的方法
Jan 18 #Javascript
原生js实现回复评论功能
Jan 18 #Javascript
js实现表格筛选功能
Jan 18 #Javascript
You might like
Oracle Faq(Oracle的版本)
2006/10/09 PHP
PHP高自定义性安全验证码代码
2011/11/27 PHP
PHP中的类型约束介绍
2015/05/11 PHP
php视频拍照上传头像功能实现代码分享
2015/10/08 PHP
js中的window.open返回object的错误的解决方法
2009/08/15 Javascript
JQuery 图片延迟加载并等比缩放插件
2009/11/09 Javascript
在JavaScript中获取请求的URL参数[正则]
2010/12/25 Javascript
用JQuery实现表格隔行变色和突出显示当前行的代码
2012/02/10 Javascript
Nodejs学习笔记之测试驱动
2015/04/16 NodeJs
JQuery中DOM事件冒泡实例分析
2015/06/13 Javascript
javascript实现网页背景烟花效果的方法
2015/08/06 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
2017/05/17 Javascript
最通俗易懂的javascript变量提升详解
2017/08/05 Javascript
jQuery实现切换隐藏与显示同时切换图标功能
2017/10/29 jQuery
[06:09]辉夜杯主赛事开幕式
2015/12/25 DOTA
[01:01:52]DOTA2-DPC中国联赛定级赛 SAG vs iG BO3第二场 1月9日
2021/03/11 DOTA
Python实现定时备份mysql数据库并把备份数据库邮件发送
2018/03/08 Python
Python单元测试工具doctest和unittest使用解析
2019/09/02 Python
Python 改变数组类型为uint8的实现
2020/04/09 Python
python中关于数据类型的学习笔记
2020/07/19 Python
Vrbo英国:预订度假屋
2020/08/19 全球购物
PHP如何调用MYSQL存储过程
2014/05/30 面试题
综合办公室主任职责
2013/12/16 职场文书
感恩节红领巾广播稿
2014/02/11 职场文书
经理管理专业毕业自荐书范文
2014/02/12 职场文书
2014年教师党员公开承诺书
2014/05/28 职场文书
小学爱国卫生月活动总结
2014/06/30 职场文书
关于感恩的演讲稿400字
2014/08/26 职场文书
大学生学习面向未来的赶考思想汇报
2014/09/12 职场文书
党员民主生活会个人整改措施材料
2014/09/16 职场文书
办公室主任个人对照检查材料思想汇报
2014/10/11 职场文书
致800米运动员广播稿(10篇)
2014/10/17 职场文书
政风行风整改方案
2014/10/25 职场文书
超市督导岗位职责
2015/04/10 职场文书
2015年学校信息技术工作总结
2015/05/25 职场文书
《静夜思》教学反思
2016/02/17 职场文书