欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-05-07 17:02:46
例子1、代码可以正常执行: <%@ page language="java" import="java.util.*" pageEn...
例子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>