我是编程和 Web 开发新手,所以我不知道如何使用正确的 Ajax/JSON。我正在使用 HTML 和 jQuery。我创建了文本输入字段,下面有一个提交按钮,我希望我的页面搜索此输入字段中的值并返回结果。
我找到了这个 jQuery 代码来做到这一点,但我不明白 url 的格式。
$("#search").click(function(){
var searchTerm = $("#searchTerm").val();// value entered by the user
var url = "https://en.wikipedia.org/w/api.php?action=opensearch&search="+ searchTerm + "&format=json&callback=?"; // url to look for using the search input by the user
$.ajax({
type:"GET",
url:url,
async:true,
dataType: "json",
success:function(data){
console.log(data[1][0]);
console.log(data[2][0]);
console.log(data[3][0]);
},
error: function(errorMessage){alert("Error");}
});
});
Run Code Online (Sandbox Code Playgroud)
输入字段是这样的:
<input class="form-control" id="searchTerm">
<button id="search" type="button" class="btn btn-primary">Submit</button>
Run Code Online (Sandbox Code Playgroud) 我正在学习CSS和HTML,我在本地创建了一个模板,第一次我有一个单独的本地CSS文件,在这个文件中,主体不会被设置样式但是div是,第二次我试图将CSS包含在HTML正文而不是单独的CSS文件,一切正常.
第一次,div被设计了风格,但是身体不是.当创建一个单独的CSS文件时:
<!DOCTYPE html>
<html>
<head>
<title>Quote Machine</title>
<script src="scripting.js"></script>
<link href="style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-2.2.3.js" integrity="sha256-laXWtGydpwqJ8JA+X9x2miwmaiKhn8tVmOVEigRNtP4=" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
</head>
<body>
<div>hello</div>
<style>
</style>
</body>
</html>
<!-- separate CSS file-->
body {
background-color:black;
}
div {
background-color:yellow;
}
Run Code Online (Sandbox Code Playgroud)
第二次,当CSS在HTML文件中时,所有内容都按需要设置样式:
<!DOCTYPE html>
<html>
<head>
<title>Quote Machine</title>
<script src="scripting.js"></script>
<link href="style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-2.2.3.js" integrity="sha256-laXWtGydpwqJ8JA+X9x2miwmaiKhn8tVmOVEigRNtP4=" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
</head>
<body>
<div>hello</div>
<style>
body {
background-color:black;
}
div {
background-color:yellow;
} …Run Code Online (Sandbox Code Playgroud)