JavaScript中窗口、框架与字符串操作及正则表达式的应用
立即解锁
发布时间: 2025-08-20 01:27:06 阅读量: 1 订阅数: 5 
JavaScript入门与实践指南
# JavaScript 中窗口、框架与字符串操作及正则表达式的应用
## 1. 窗口与框架的安全限制及操作
### 1.1 安全限制
浏览器对脚本在框架和窗口之间可访问的信息设置了一定限制。当所有页面都来自同一服务器，或者在本地加载到浏览器时，脚本对可访问和操作的内容有相对自由的权限。但仍存在一些限制，例如在用户打开的浏览器窗口中使用 `window.close()` 方法时，会弹出消息框让用户选择是否取消关闭操作。
当一个服务器上的窗口或框架中的页面试图访问另一个服务器上的窗口或框架的属性时，同源策略就会生效，脚本的操作会受到很大限制。例如：
```javascript
var myWindow = window.open("http://www.anotherserver.com/anotherpage.htm","myWindow");
// 以下代码会导致安全问题，被浏览器阻止
var myVariable = myWindow.document.form1.text1.value;
```
同源限制同样适用于框架（常规框架和 `iframe`）和窗口，其目的是防止黑客利用代码提取信息。因此，如果页面托管在不同服务器上，应避免跨框架或窗口编写脚本。
### 1.2 框架操作
框架式网站有很多实用之处，因此需要创建能与框架及其内部文档和代码交互的 JavaScript。框架的一个优点是可以将通用函数放在一个框架中，创建一个供整个网站使用的 JavaScript 代码模块。
编码框架的关键是获取其他框架的 `window` 对象引用，可通过 `window` 对象的 `parent` 属性和 `top` 属性访问层次结构中更高的框架：
- `parent` 属性返回包含当前 `window` 对象的窗口对象，即包含创建该窗口的框架集的页面。
- `top` 属性返回包含所有其他框架的窗口的 `window` 对象。
访问框架集中的每个框架有三种方法：
1. 使用框架的名称。
2. 使用 `frames` 集合并指定框架的索引。
3. 通过 `frames` 集合中框架的名称访问，如 `parent.frames.frameName`，这是最安全的方法，可避免与全局变量冲突。
如果要访问的框架定义在另一个窗口中，需要使用 `parent` 或 `top` 属性获取定义该框架的窗口对象的引用，然后指定框架在 `frames` 集合中的名称或位置。
### 1.3 窗口操作
可以使用 `window` 对象的 `open()` 方法打开新的浏览器窗口，该方法接受三个参数：要打开页面的 URL、新窗口的名称以及可选的窗口特性定义。`window.open()` 方法返回新窗口的 `window` 对象引用，可通过该引用访问窗口的文档、脚本和方法。
关闭窗口使用 `window.close()` 方法，检查窗口是否关闭使用 `window` 对象的 `closed` 属性。新打开的窗口对象可通过 `window.opener` 属性访问打开它的窗口。窗口打开后，可使用 `resizeTo(x,y)` 和 `resizeBy(x,y)` 调整大小，使用 `moveTo(x,y)` 和 `moveBy(x,y)` 移动窗口。
### 1.4 练习问题
1. 将之前创建的允许用户选择计算机系统的表单示例改为基于框架的网页，将系统详情写入另一个框架，而不是文本区域。提示：使用 `about:blank` 作为写入框架的 `src`，使用 `document` 对象的 `close()` 和 `open()` 方法清除框架中的先前数据。
2. 修改包含书籍图片的页面示例，使弹出窗口添加一个按钮或链接，点击后将物品添加到购物篮。同时，在主页面上为用户提供打开购物篮窗口查看已购买物品详情的方式，并允许用户从购物篮中删除物品。
## 2. 字符串操作与正则表达式
### 2.1 字符串对象的已有方法回顾
JavaScript 的 `String` 对象提供了一些属性和方法，如 `length`（字符串长度）、`charAt()` 和 `charCodeAt()`（返回指定位置的字符或字符代码）、`indexOf()` 和 `lastIndexOf()`（搜索字符串中另一个字符串的存在并返回位置）、`substr()` 和 `substring()`（返回字符串的一部分）、`toUpperCase()` 和 `toLowerCase()`（将字符串转换为大写或小写）。
### 2.2 新增的字符串方法
#### 2.2.1 `split()` 方法
`split()` 方法将单个字符串拆分为子字符串数组，拆分位置由传递给该方法的分隔符参数决定。例如：
```javascript
var myString = "A,B,C";
var myTextArray = myString.split(',');
```
上述代码将字符串按逗号拆分为数组 `["A", "B", "C"]`。如果字符串为 `"A,B,C,"`，则会拆分为四个元素，最后一个元素为空字符串。
以下是一个使用 `split()` 方法反转文本区域中各行顺序的示例：
```html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Example 1</title>
<script language="JavaScript" type="text/JavaScript">
function splitAndReverseText(textAreaControl)
{
var textToSplit = textAreaControl.value;
var textArray = textToSplit.split('\n');
var numberOfParts = 0;
numberOfParts = textArray.length;
var reversedString = "";
var indexCount;
for (indexCount = numberOfParts - 1; indexCount >= 0; indexCount-- )
{
reversedString = reversedString + textArray[indexCount];
if (indexCount > 0)
{
reversedString = reversedString + "\n";
}
}
textAreaControl.value = reversedString;
}
</script>
</head>
<body>
<form name="form1">
<textarea rows="20" cols="40" name="textarea1" wrap="soft">Line 1
Line 2
Line 3
Line 4</textarea>
<br />
<input type="button" value="Reverse Line Order" name="buttonSplit"
onclick="splitAndReverseText(document.form1.textarea1)">
</form>
</body>
</html>
```
#### 2.2.2 `replace()` 方法
`replace()` 方法在字符串中搜索子字符串的出现位置，并将匹配的子字符串替换为指定的第三个字符串。例如：
```javascript
var myString = "The event will be in May, the 21st of June";
var myCleanedUpString = myString.replace("May","June");
```
`replace()` 方法不会改变原字符串的值，而是返回替换后的新字符串。
#### 2.2.3 `search()` 方法
`search()` 方法用于在字符串中搜索特定文本，如果找到则返回其字符位置，否则返回 -1。该方法只接受一个参数，即要搜索的文本。在使用纯文本时，`search()` 方法与 `indexOf()` 方法相比没有明显优势，但在使用正则表达式时，其强大功能会显现出来。例如：
```javascript
var myString = "Beginning JavaScript, Beginning Java, Professional JavaScript";
alert(myString.search("Java")); // 输出 10
```
#### 2.2.4 `match()` 方法
`match()` 方法与 `search()` 方法类似，但它返回一个数组，数组的每个元素包含找到的每个匹配文本。使用纯文本时，`match()` 方法意义不大，但使用正则表达式时非常有用。例如：
```javascript
var myString = "1997, 1998, 1999, 2000, 2000, 2001, 2002";
var myMatchArray = myString.match("2000");
alert(myMatchArray.length);
```
### 2.3 正则表达式
正则表达式允许定义字符模式，用于文本搜索或替换。JavaScript 通过 `RegExp` 对象使用正则表达式，创建新的 `RegExp` 对象有两种方式：
- 使用正则表达式字面量，如 `var myRegExp = /\b’|’\b/;`。
- 使用 `RegExp` 对象的构造函数 `RegExp()`，如 `var myRegExp = new RegExp("
400次
会员资源下载次数
300万+
优质博客文章
1000万+
优质下载资源
1000万+
优质文库回答
0
0
复制全文
相关推荐
最低0.47元/天 解锁专栏
赠100次下载
百万级
高质量VIP文章无限畅学
千万级
优质资源任意下载
千万级
优质文库回答免费看
立即解锁
专栏目录
最新推荐
构建可扩展医疗设备集成方案：飞利浦监护仪接口扩展性深入解析
# 摘要
本文探讨了医疗设备集成的重要性和面临的挑战，重点分析了飞利浦监护仪接口技术的基础以及可扩展集成方案的理论框架。通过研究监护仪接口的技术规格、数据管理和标准化兼容性，本文阐述了实
【调试与性能优化】：LMS滤波器在Verilog中的实现技巧
# 摘要
本文详细探讨了最小均方(LMS)滤波器的理论基础、硬件实现、调试技巧以及性能优化策略，并通过实际案例分析展示了其在信号处理中的应用。LMS滤波器作为一种自适应滤波器，在数字信号处理领域具有重要地位。通过理论章节，我们阐述了LMS算法的工作原理和数学模型，以及数字信号处理的基础知识。接着，文章介绍了LMS滤波器的Verilog实现，包括Verilog语言基础、模块
【BT-audio音频抓取工具比较】：主流工具功能对比与选择指南
# 摘要
本文旨在全面介绍BT-audio音频抓取工具，从理论基础、功能对比、实践应用到安全性与隐私保护等多个维度进行了深入探讨。通过分析音频信号的原理与格式、抓取工具的工作机制以及相关法律和伦理问题，本文详细阐述了不同音频抓取工具的技术特点和抓取效率。实践应用章节进一步讲解了音频抓取在不同场景中的应用方法和技巧，并提供了故障排除的指导。在讨论工具安全性与隐私保护时，强调了用户数据安全的重要性和提高工具安全性的策略。最后，本文对音频抓取工具的未来发展和市场需求进行了展望，并提出了选择合适工具的建议。整体而言，本文为音频抓取工具的用户提供了一个全面的参考资料和指导手册。
# 关键字
音频抓取；
【wxWidgets多媒体处理】：实现跨平台音频与视频播放
# 摘要
本文详细探讨了基于wxWidgets的跨平台多媒体开发，涵盖了多媒体处理的基础理论知识、在wxWidgets中的实践应用，以及相关应用的优化与调试方法。首先介绍多媒体数据类型与
MATLAB程序设计模式优化：提升pv_matlab项目可维护性的最佳实践
# 摘要
本文全面探讨了MATLAB程序设计模式的基础知识和最佳实践，包括代码的组织结构、面向对象编程、设计模式应用、性能优化、版本控制与协作以及测试与质量保证。通过对MATLAB代码结构化的深入分析，介绍了函数与脚本的差异和代码模块化的重要性。接着，本文详细讲解了面向对象编程中的类定义、继承、封装以及代码重用策略。在设计模式部分，本文探讨了创建型、结构型和行为型模式在MATLAB编程中的实现与应用
【C#跨平台开发与Focas1_2 SDK】：打造跨平台CNC应用的终极指南
# 摘要
本文全面介绍了C#跨平台开发的原理与实践，从基础知识到高级应用，详细阐述了C#语言核心概念、.NET Core与Mono平台的对比、跨平台工具和库的选择。通过详细解读Focas1_2 SDK的功能与集成方法，本文提供了构建跨平台CNC应用的深入指南，涵盖CNC通信协议的设计、跨平台用户界面的开发以及部署与性能优化策略。实践案例分析部分则通过迁移现有应用和开发新应用的实战经验，向读者展示了具体的技术应用场景。最后，本文对
STM8点阵屏汉字显示：用户界面设计与体验优化的终极指南
# 摘要
STM8点阵屏技术作为一种重要的显示解决方案，广泛应用于嵌入式系统和用户界面设计中。本文首先介绍STM8点阵屏的技术基础，然后深入探讨汉字显示的原理，并着重分析用户界面设计策略，包括布局技巧、字体选择、用户交互逻辑及动态效果实现等。接着，本文详细阐述了STM8点阵屏的编程实践，涵盖开
【机器人灵巧手力控制技术】：精准操作的实现秘诀
# 摘要
本文综述了机器人灵巧手力控制技术，从基础理论到高级应用进行了系统性的探讨。首先介绍了力控制的基本概念和理论基础，包括力与力矩的定义以及其在机器人操作中的重要性。随后，文章深入探讨了力控制系统的数学模型和关键技术，涵盖了力传感器的选择、控制策略及其实施方法。在实践章节中，本文详细阐述了力控制技术在机器人硬件实现、控制算法编程和实际应用案例中的运用，并对实验结果进行了性能评估。此外，文章还探讨了力控制技术在医疗手术机器人、微装配等特定行业的应用，并展望了未来力控制技术的发展趋势，如新型传感器技术和集成化设计。最后，本文总结了灵巧手力控制所面临的挑战，并提出了可能的解决方案。通过本文的研究
【游戏物理引擎基础】：迷宫游戏中的物理效果实现
# 摘要
Matlab作为一种广泛应用于工程计算和科研领域的编程语言，其直观、高效的编程特点使其成为解决复杂工程问题的有效工具。本文首先介绍了Matlab编程的基本概念和基础语法结构，包括变量操作、数据类型、图形绘制以及控制流程。随后，本文深入探讨了Matlab在解决特定工程问题中的应用，如信号处理、电路仿真、优化问题求解、数值计算等。此外，通过实战演练章节，本文展示了Matlab在
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
