JavaScript代码片段集：网页交互与样式控制

"站长常用的200个js代码.txt" 是一份针对网站管理员或开发者整理的JavaScript代码集合，其中包含了初级到进阶的各种实用代码片段，适用于网页交互和美化。这些代码可以帮助提升用户体验，实现诸如文本框焦点处理、按钮样式变换、鼠标事件响应等常见功能。 1. 文本框焦点问题：在网页设计中，用户输入表单是常见的交互元素。`onFocus` 和 `onBlur` 事件分别用于在文本框获取焦点和失去焦点时触发相应的动作。例如，当用户点击一个空白的文本框时，可以自动清空预填充的提示文本；当用户离开该文本框时，如果未输入内容，可以将提示文本恢复。 ```html <input type="text" value="请输入内容" onfocus="if(value=='请输入内容'){value=''}" onblur="if(value==''){value='请输入内容'}"> ``` 2. 网页按钮的特殊颜色：通过设置 `style` 属性，可以自定义按钮的背景颜色、边框和字体颜色，以实现独特的视觉效果。例如： ```html <input type="button" name="Submit1" value="提交" size=10 class=s02 style="background-color:rgb(235,207,22)"> ``` 3. 鼠标移入移出时颜色变化：利用 `onMouseOver` 和 `onMouseOut` 事件，可以改变按钮在鼠标悬停时的颜色，增强用户的交互体验： ```html <input type="submit" value="点击" name="B1" onMouseOut="this.style.color='blue'" onMouseOver="this.style.color='red'" class="button"> ``` 4. 平面按钮：通过设定合适的边框宽度和颜色，以及背景色，可以创建具有不同视觉效果的平面按钮： ```html <input type="submit" value="提交" style="border:1px solid #666666; height:17px; width:25pt; font-size:9pt; BACKGROUND-COLOR:#E8E8FF; color:#666666" name="submit"> ``` 5. 自定义文本框风格：可以调整文本框的边框样式、宽度、高度、字体大小和颜色，以及背景色，以满足设计需求： ```html <input type="text" name="nick" style="border:1px solid #666666; font-size:9pt; height:17px; BACKGROUND-COLOR:#F4F4FF; color:#ff6600" size="15" maxlength="16"> ``` 6. 设置文本框边框样式：通过设置 `border-style` 属性，可以改变文本框的边框类型，如实线、虚线等： ```html <input type="text" name="T1" size="20" style="border-style:solid; border-width:1"> ``` 7. 设置窗口尺寸：在JavaScript中，`window.resizeTo(width, height)` 方法可以用来调整浏览器窗口的大小，这里的示例将窗口尺寸设为300像素宽、283像素高： ```html <script> window.resizeTo(300, 283); </script> ``` 8. 滚动文字效果：`<marquee>` 标签可以创建水平或垂直滚动的文字效果，通过调整 `direction`、`scrollamount` 和 `scrolldelay` 属性来控制滚动方向、速度和延迟： ```html <marquee direction="up" scrollamount=1 scrolldelay=100 onmouseover='this.stop()' onmouseout='this.start()' height=60> <!--head_scrolltext--> <tr> <td> 这里是滚动文字内容 </td> </tr> <!--endhead_sc--> ``` 这个文件包含的200个JavaScript代码涵盖了网页开发中的多个方面，对于初学者和有一定经验的站长来说，都是很好的参考和学习材料。通过理解和运用这些代码，可以更好地优化网站的交互性和美观性。