JavaScript 简介
JavaScript 是互联网上最流行的脚本语言,这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
简单的javascripts
<script>
alert("我的第一个 JavaScript");
</script>
这是一个javascript页面
中的 JavaScript 在本例中,JavaScript 会在页面加载时向 HTML 的 写文本:<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落</p>");
</script>
这是一个javascript页面
在 或者 的JavaScript 您可以在 HTML 文档中放入不限数量的脚本。脚本可位于 HTML 的 或 部分中,或者同时存在于两个部分中。
通常的做法是把函数放入 部分中,或者放在页面底部。这样就可以把它们安置到同一处位置,不会干扰页面的内容
我的 Web 页面
一个段落。
点击这里 中的 JavaScript 函数 在本例中,我们把一个 JavaScript 函数放置到 HTML 页面的 部分。该函数会在点击按钮时被调用:
我的第一个 Web 页面
一个段落。
点击这里 外部的 JavaScript 也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。外部 JavaScript 文件的文件扩展名是 .js。
如需使用外部文件,请在
我的 Web 页面
一个段落。
点击这里注释:myFunction 保存在名为 "myScript.js" 的外部文件中。
聚焦(onfocus)和离焦(onblur)事件: onfocus事件:聚焦事件,onfocus 事件在对象获得焦点时发生。 onblur事件:离焦事件,onblur 事件会在对象失去焦点时发生。 为了使用户体验更好,在鼠标点击到用户名的框时,右边提示输入用户名和密码的要求,当离开框时,检测用户名和密码是否正确。我们在平常的登录过程当中,用户名和密码栏后面一般会有所输入内容相关要求和提示的,并不会总是 跳出警示框,这种需求该如何实现呢?那就需要用到聚焦和离焦事件。
<script>
function showUserTips() {
var usertipsObj = document.getElementById('usertips');
var info ='<span style="color: gray">用户名长度大于2</span>';
// alert(usertipsObj.innerHTML);
usertipsObj.innerHTML = info;
}
function checkUser() {
//获取当前用户提交的用户名,默认情况下getElementsByName返回列表对象, .value获取对象里面的值
var username = document.getElementsByName('username')[0].value;
// 判断用户名是否为空, 如果为空, 报错
var usertipsObj = document.getElementById('usertips');
if (username.length <= 2) {
usertipsObj.innerHTML = '<span style="color: red">用户名长度不大于2</span>'
}else{
usertipsObj.innerHTML = '<span style="color: green;">ok</span>'
}
}
</script>
用户登录
<script>
function showUserTips() {
var usertipsObj = document.getElementById('usertips');
var info ='<span style="color: gray">用户名长度大于2</span>';
// alert(usertipsObj.innerHTML);
usertipsObj.innerHTML = info;
}
function checkUser() {
//获取当前用户提交的用户名,默认情况下getElementsByName返回列表对象, .value获取对象里面的值
var username = document.getElementsByName('username')[0].value;
// 判断用户名是否为空, 如果为空, 报错
var usertipsObj = document.getElementById('usertips');
if (username.length <= 2) {
usertipsObj.innerHTML = '<span style="color: red">用户名长度不大于2</span>'
}else{
usertipsObj.innerHTML = '<span style="color: green;">ok</span>'
}
}
</script>
用户登录
<th><input type="checkbox" id="checkAll" onclick="checkAll()"></th>
<th>编号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<tr>
<td><input type="checkbox" name="checkOne"></td>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td><input type="checkbox" name="checkOne"></td>
<td>2</td>
<td>1</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td><input type="checkbox" name="checkOne"></td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>1</td>
</tr>
<tr>
<td><input type="checkbox" name="checkOne"></td>
<td>4</td>
<td>4</td>
<td>1</td>
<td>4</td>
</tr>
<tr>
<td><input type="checkbox" name="checkOne"></td>
<td>5</td>
<td>5</td>
<td>1</td>
<td>5</td>
</tr>
<ul id="city_ul">
<li>西安</li>
<li>成都</li>
<li>上海</li>
</ul>
省级信息二级联动
<script type="text/javascript" src="js/province.js">
</script>
籍贯
---选择省份----- 陕西 山西 广西 ---选择城市---
</form>