为什么 querySelector (JavaScript) 不能与 Internet Explorer 一起使用?



我在下面有以下代码,它应该将值从一个HTML页面传递到另一个HTML页面。该代码适用于Firefox,但不适用于IE 11。你能告诉我为什么代码不起作用吗?提前致谢

形式

.HTML
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>OrderUp</title>
</head>
<body>
     <form method="get" action="results.html" >  
    Name : <input name = "name" type= "text" id="name">
    <br>
    <input value = "Submit" type = "submit" >
 </form>
</body>
</Html>

结果

.HTML
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Results</title>
</head>
<body>
    <h2> Your Form Has Been Submitted </h2>
<div class = "first"> Name: </div>
<script>
   let params = (new URL(document.location)).searchParams;
   let name = params.get("name");
   console.log(name) 
   document.querySelector('.first').innerText += name;
</script>
</body>
</html>

您遇到的问题是您正在使用 IE11 不支持的功能(let,URL API(。请参阅我的评论。以下内容在IE11中对我有用。它基于这个堆栈溢出帖子。如果您想使用 ES6 语法,您可以尝试使用 ES6 到 ES5 转译器。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Results</title>
    <script>
var parseQueryString = function() {
    var str = window.location.search;
    var objURL = {};
    str.replace(
        new RegExp( "([^?=&]+)(=([^&]*))?", "g" ),
        function( $0, $1, $2, $3 ){
            objURL[ $1 ] = $3;
        }
    );
    return objURL;
};
    </script>
</head>
<body>
    <h2> Your Form Has Been Submitted </h2>
<div class = "first"> Name: </div>
<script>
   var params = parseQueryString();
   var name = params["name"];
   console.log(name) 
   document.querySelector('.first').innerText += name;
</script>
</body>
</html>

最新更新