当前位置: 移动技术网 > IT编程>开发语言>JavaScript > js 放在html 的位置 不同 造成的结果页不相同

js 放在html 的位置 不同 造成的结果页不相同

2017年12月21日  | 移动技术网IT编程  | 我要评论
例子1、代码可以正常执行:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<html>

<head>

  <style>span {display:none;}</style>

  <script src="https://code.jquery.com/jquery-latest.min.js"></script>

</head>

 

  <script>

    $(document).ready(function() {

        $("input").focus(function () {

            $(this).next("span").css('display','inline').fadeOut(1000);

        });

    });

  </script>

 

<body>

 

  <p><input type="text" /> <span>focus fire</span></p>

  <p><input type="password" /> <span>focus fire</span></p>

 

 

</body>

</html>

 

 

 

例子2、代码可以正常执行:

 

 

<!DOCTYPE html>

<html>

<head>

  <style>span {display:none;}</style>

  <script src="https://code.jquery.com/jquery-latest.min.js"></script>

</head>

<body>

  <p><input type="text" /> <span>focus fire</span></p>

 

<p><input type="password" /> <span>focus fire</span></p>

<script>

    $("input").focus(function () {

         $(this).next("span").css('display','inline').fadeOut(1000);

    });

</script>

 

</body>

</html>

 

例子3、代码中的js不能正常执行

 

<!DOCTYPE html>

<html>

<head>

  <style>span {display:none;}</style>

  <script src="https://code.jquery.com/jquery-latest.min.js"></script>

</head>

<script>

    $("input").focus(function () {

         $(this).next("span").css('display','inline').fadeOut(1000);

    });

</script>

 

<body>

  <p><input type="text" /> <span>focus fire</span></p>

 

<p><input type="password" /> <span>focus fire</span></p>

 

</body>

</html>

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网