### JavaScript小技巧详解
在日常开发过程中，JavaScript作为前端开发的核心语言之一，其灵活多变的特性让开发者能够实现各种复杂的功能与交互效果。本文将根据提供的内容，深入解析其中涉及的一些JavaScript技巧与知识点。
#### 事件处理
1. **事件源属性**：`event.srcElement`用于获取触发事件的元素。
- `event.srcElement.tagName`：返回触发事件的元素标签名。
- `event.srcElement.type`：如果触发事件的是表单控件，则返回该控件的类型。
- `event.srcElement.setCapture()` 和 `event.srcElement.releaseCapture()`：分别用来捕获和释放对某个元素的事件捕获。这允许事件首先传递到该元素，然后再传递到父元素。
2. **键盘事件属性**：
- `event.keyCode`：返回按下键的键码值。
- `event.shiftKey`、`event.altKey`、`event.ctrlKey`：分别判断是否按下了Shift、Alt或Ctrl键。
3. **鼠标事件属性**：
- `event.returnValue`：用于设置或返回事件的返回值，常用于阻止默认行为。
- `event.x` 和 `event.y`：返回鼠标点击时相对于视口的位置坐标。
#### 文档操作
1. **文档焦点**：
- `document.activeElement`：返回当前获得焦点的元素。
2. **文档事件监听**：
- `document.captureEvents(Event.KEYDOWN)`：捕获键盘按下事件。
3. **DOM元素操作**：
- `document.all("txt").focus()` 和 `document.all("txt").select()`：分别使文本框获得焦点和选中文本。
- `document.createElement("SPAN")`：创建一个新的`<span>`元素。
- `document.elementFromPoint(event.x, event.y).tagName == "TD"`：根据鼠标位置获取对应的DOM元素，并判断其是否为表格单元格。
4. **其他操作**：
- `document.images[]`：访问页面中的所有图片元素。
- `document.getElementsByName("r1")` 和 `document.getElementById(id)`：通过名称或ID查找元素。
- `document.all.xxx.detachEvent('onclick', a)`：移除指定的事件监听器。
#### 浏览器功能
1. **插件检测**：
- `navigator.plugins`：返回一个数组，包含浏览器中安装的所有插件的信息。
2. **类型检测**：
- `typeof($js_libpath)=="undefined"`：检测变量是否存在。
3. **定时器操作**：
- `setInterval('scrollwindow()', delay)` 和 `clearInterval(timer)`：设置和清除定时器。
4. **URL编码与解码**：
- `escape()` 和 `unescape()`：用于URL字符串的编码和解码。
#### CSS样式操作
1. **动态更改CSS文件**：
- `document.all.csss.href="a.css"`：动态更改链接的CSS文件。
2. **CSS属性设置**：
- `display:inline`：将元素显示为行内元素。
- `hidefocus=true`：隐藏元素获得焦点时的高亮效果。
- `word-break:break-all`：当单词过长时强制换行。
3. **自动刷新页面**：
- `<meta HTTP-EQUIF="refresh" CONTENT="8;URL=http://c98.yeah.net">`：设置页面自动刷新。
4. **邮件链接**：
- `<a href="mailto:aaa@bbb.com?subject=ccc&body=xxx yyy">`：创建一个带有预设主题和正文的邮件链接。
5. **滚动定位**：
- `obj.scrollIntoView(true)`：滚动页面，使元素可见。
6. **锚点定位**：
- `<a name="first">` 和 `<a href="#first">`：创建和指向锚点。
7. **查询字符串**：
- `location.search()`：返回当前URL的查询字符串部分。
8. **编辑功能**：
- `obj.contenteditable=true`：使元素可编辑。
9. **命令执行**：
- `obj.execCommand`：执行命令，例如复制、粘贴等。
#### 其他技巧
1. **框架操作**：
- `<IFRAME src="1.htm" width=300 height=180 allowtransparency></iframe>`：创建一个透明边框的内联框架。
2. **样式设置**：
- `obj.style.cssText`：设置或返回对象的CSS样式文本。
3. **HTML内容操作**：
- `document.documentElement.innerHTML`：获取或设置整个HTML文档的内容。
4. **样式表操作**：
- `document.styleSheets[0]`：访问第一个样式表。
- `document.styleSheets[0].rules[0]`：访问第一个样式表的第一个规则。
5. **页面来源检测**：
- ASP中使用 `request.servervariables("HTTP_REFERER")` 或 JavaScript中使用 `document.referrer` 来获取前一页面的URL。
6. **垃圾回收**：
- `CollectGarbage()`：手动触发垃圾回收机制。
7. **禁用右键菜单**：
- `document.oncontextmenu = function() { return false; }`：禁用页面的右键菜单。
8. **条件性加载**：
- `<noscript><iframe src="*.htm"></iframe></noscript>`：只有当脚本被禁用时才加载框架。
9. **防止选择和拖拽**：
- 使用 `oncontextmenu="return false"`、`ondragstart="return false"` 和 `onselectstart="return false"` 属性来防止用户选择、拖拽页面内容。
以上内容涵盖了从事件处理、文档操作、浏览器功能、CSS样式操作到其他实用技巧等多个方面，这些技巧可以帮助开发者更加高效地进行前端开发工作。希望这些知识点能对大家有所帮助。
