JavaWeb系列三: JavaScript學習 下

文章目錄

  • js數組
    • 定義方式
    • 數組遍歷
  • js函數
    • 函數入門
    • 函數使用方式
      • 使用方式一
      • 使用方式二
    • 函數注意事項
    • 函數練習題
  • 定義對象
    • 使用object定義
    • 使用{}定義
  • 事件
    • onload事件
    • onclick事件
    • 失去焦點事件
    • 內容發生改變事件
    • 表單提交事件
      • 靜態注冊
      • 動態注冊
      • 表單作業
  • dom對象
  • 文檔對象模型
  • document對象
    • 應用實例一
    • 應用實例二
    • 應用示例三
    • 應用案例四
  • DOM節點
    • 節點常用方法
      • 通過id獲取節點
      • 獲取所有option節點
      • 通過name獲取節點
      • 查找id=language下所有li節點
      • 獲取指定dom對象的所有子節點
      • 獲取第一個子節點
      • 獲取父節點
      • 獲取前后兄弟節點
      • 設置文本域內容
  • js dom 烏龜吃雞游戲
    • 靜態注冊實現

在這里插入圖片描述

js數組

定義方式

array_define.html
在這里插入圖片描述
在這里插入圖片描述

數組遍歷

traversal-array.html
在這里插入圖片描述

js函數

函數入門

simple_function.html
在這里插入圖片描述

函數使用方式

使用方式一

1.function-use.html
在這里插入圖片描述

使用方式二

2.function-use.html
在這里插入圖片描述

函數注意事項

function-detail.html
在這里插入圖片描述

在這里插入圖片描述
在這里插入圖片描述

函數練習題

function-exercise.html
在這里插入圖片描述

定義對象

使用object定義

1.object_difine.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>自定義對象</title><script type="text/javascript">//自定義對象的方式一//person是一個空對象, 沒有自定義的函數和屬性var person = new Object();//built-inconsole.log("person類型 = " + typeof(person));//object//增加一個屬性nameperson.name = "趙志偉";//增加一個屬性ageperson.age = 22;//增加一個函數person.hi = function () {//這里的this就是當前的personconsole.log("person的信息 " + this.name + " " + this.age);}//訪問屬性console.log("name=" + person.name);//訪問方法person.hi();//小細節,如果沒有定義某個屬性,直接使用,就會出現:變量提升(專業術語),顯示undefinedconsole.log(person.email);//undefined//方法不能提升person.say();</script>
</head>
<body></body>
</html>

使用{}定義

2.function_define.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>z自定義對象方法2: {} 形式</title><script type="text/javascript">//演示自定義對象方法2: {} 形式var person = {name: "趙志偉",//多個屬性之間使用,隔開age: 23,hi: function () {console.log("person信息 = " + this.name + this.age);},sum: function (n1, n2) {return n1 + n2;}}//使用console.log("person.name=" + person.name + ", person.age=" + person.age);person.hi();console.log("sum=" + person.sum(1, 2));</script>
</head>
<body>
</body>
</html>

事件

在這里插入圖片描述

  1. 事件的注冊(綁定)
    事件注冊(綁定),當事件響應(觸發)后要瀏覽器執行哪些操作代碼,叫做事件注冊或事件綁定;
  2. 靜態注冊事件
    通過html標簽的事件屬性直接賦予事件響應后的代碼,這種方式叫做靜態注冊;
  3. 動態注冊事件(dom)
    通過 js 代碼得到標簽的 dom 對象,然后再通過 dom 對象.事件名 = function () {} 這種形式叫做動態注冊
    步驟:(1)獲取標簽對象dom對象; (2)標簽對象.事件名 = function() {}

onload事件

onload.html
在這里插入圖片描述

onclick事件

onclick.html在這里插入圖片描述

失去焦點事件

onblur.html
在這里插入圖片描述

內容發生改變事件

onchange.html
在這里插入圖片描述
在這里插入圖片描述

表單提交事件

靜態注冊

onsubmit.html
在這里插入圖片描述

動態注冊

onsubmit1.html
在這里插入圖片描述
在這里插入圖片描述

表單作業

onsubmit-作業.html
在這里插入圖片描述
在這里插入圖片描述

dom對象

  1. DOM 全稱是 Document Object Model 文檔對象模型;
  2. 就是將文檔中的標簽, 屬性, 文本轉換成對象來管理;
    在這里插入圖片描述

文檔對象模型

  1. 當網頁被加載時, 瀏覽器會創建頁面的文檔對象模型(Document Object Model)
  2. html dom 樹

document對象

  1. document 它管理了所有的HTML 文檔內容;
  2. document 它是一種樹結構的文檔;
  3. 有層級關系, 在 dom中把所有的標簽都 對象化;
  4. 通過document 可以訪問所有的標簽對象;

應用實例一

getElementById.html
在這里插入圖片描述

應用實例二

1.靜態注冊

getElementsByName.html

在這里插入圖片描述
在這里插入圖片描述
2.動態注冊
getElementsByName-動態注冊.html
在這里插入圖片描述
在這里插入圖片描述

應用示例三

getElementsByTagName.html
在這里插入圖片描述

  • 升級版:做到貓狗切換

思路:根據value值判斷選擇具體的執行方法
在這里插入圖片描述

應用案例四

createElements.html
在這里插入圖片描述

DOM節點

在HTML DOM(文檔對象模型)中,每個部分都是節點

  1. 文檔 本身是文檔節點;
  2. 所有 HTML元素 是元素節點;
  3. 所有 HTML屬性 是屬性節點;
  4. HTML元素內的 文本 是文本節點;
  5. 注釋是 注釋 節點;

節點常用方法

通過id獲取節點

html-dom-01.html
在這里插入圖片描述

獲取所有option節點

html-dom02.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//查找所有option節點var btn02 = document.getElementById("btn02");btn02.onclick = function () {//id --> getElementById()//name --> getElementsByName()//元素標簽 --> getElementsByTagName()var options = document.getElementsByTagName("option");//HTMLCollectionfor (var i = 0; i < options.length; i++) {alert("options[" + (i + 1) + "] = " + options[i].innerText);}};};</script>
</head>
<body>
<div><div><p>你當前的女友是誰:</p><select id="sel01"><option>--女友--</option><option>霞燕</option><option id="ct" value="春桃姑娘">春桃</option><option>秋楓</option><option>冬梅</option></select></div>
</div>
<div id="btnList"><div><button id="btn02">查找所有option節點</button></div>
</div>
</body>
</html>

通過name獲取節點

html-dom03.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//查找name=sport節點var btn03 = document.getElementById("btn03");btn03.onclick = function () {var sports = document.getElementsByName("sport");// alert(sports);//NodeListfor (var i = 0; i < sports.length; i++) {if (sports[i].checked) {alert("運動是 = " + sports[i].value);}}};}</script>
</head>
<body>
<div><div><p>你喜歡的運動項目:</p><input type="checkbox" name="sport" value="soccer" checked="checked"/>足球<input type="checkbox" name="sport" value="basketball" checked="checked"/>藍球<input type="checkbox" name="sport" value="pingPang" checked="checked"/>乒乓球</div>
</div>
<div id="btnList"><div><button id="btn03">查找name=sport節點</button></div>
</div>
</body>
</html>

查找id=language下所有li節點

html-dom04.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//查找id=language下所有li節點var btn04 = document.getElementById("btn04");btn04.onclick = function () {var lis = document.getElementById("language").getElementsByTagName("li");// alert("lis=" + lis);//HTMLCollectionfor (var i = 0; i < lis.length; i++) {alert("lis[" + (i + 1) + "] = " + lis[i].innerText);}};};</script>
</head>
<body>
<div><div><p>你的編程語言:</p><ul id="language"><li id="java">Java</li><li>Python</li><li>Go語言</li></ul></div>
</div>
<div id="btnList"><div><button id="btn04">查找id=language下所有li節點</button></div>
</div>
</body>
</html>

獲取指定dom對象的所有子節點

html-dom05.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//返回id=sel01的所有子節點var btn05 = document.getElementById("btn05");btn05.onclick = function () {//var options = document.getElementById("sel01").getElementsByTagName("option");//alert(options.length);//5 不算換行符//1. 如果使用document.getElementById("sel01").childNodes; 獲取的是[object Text],[object HTMLOptionElement]//2. 如果不希望得到 text對象, 需要將所有的內容放在一行var childNodes = document.getElementById("sel01").childNodes;//alert(childNodes);//NodeList//alert(childNodes.length);//11, 加上文本, 在這里換行符屬于文本[object Text]for (var i = 0; i < childNodes.length; i++) {//alert(childNodes[i]);//HTMLOptionElementif (childNodes[i].innerText != undefined && childNodes[i].selected) {alert("女友有 = " + childNodes[i].innerText);}}alert("===============還有一個方法===============");//1.sel01 是 HTMLSelectElement => 本身具有集合的特點var sel01 = document.getElementById("sel01");alert(sel01);//HTMLSelectElementalert(sel01[0]);//HTMLOptionElementfor (var i = 0; i < sel01.length; i++) {alert("sel01[" + (i + 1) + "] = " + sel01[i].innerText);}};};</script>
</head>
<body>
<div><div><p>你當前的女友是誰:</p><select id="sel01"><option>--女友--</option><option>霞燕</option><option id="ct" value="春桃姑娘">春桃</option><option>秋楓</option><option>冬梅</option></select></div>
</div>
<div id="btnList"><div><button id="btn05">返回id=sel01的所有子節點</button></div>
</div>
</body>
</html>

獲取第一個子節點

html-dom06.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//返回id=sel01 的第一個子節點var btn06 = document.getElementById("btn06");btn06.onclick = function () {var sel01 = document.getElementById("sel01");var childNodes = sel01.childNodes;alert(childNodes[0]);//object Textvar firstChild = sel01.firstChild;alert(firstChild);//object Text]alert(sel01[0]);//直接得到第一個option節點 object HTMLOptionElement}};</script>
</head>
<body>
<div><div><p>你當前的女友是誰:</p><select id="sel01"><option>--女友--</option><option>霞燕</option><option id="ct" value="春桃姑娘">春桃</option><option>秋楓</option><option>冬梅</option></select></div>
</div>
<div id="btnList"><div><button id="btn06">返回id=sel01的第一個子節點</button></div>
</div>
</body>
</html>

獲取父節點

html-dom07.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//返回id=java的父節點var btn07 = document.getElementById("btn07");btn07.onclick = function () {var java = document.getElementById("java");alert(java);//HTMLLIElementvar parentNode = java.parentNode;alert(parentNode);//HTMLUListElementalert(parentNode.innerText);alert(parentNode.innerHTML);//<li id="java">Java</li>var childNodes = parentNode.childNodes;alert(childNodes.length);//7for (var i = 0; i < childNodes.length; i++) {if (childNodes[i].innerText != undefined) {//換行符[文本]也算一個節點alert("childNodes[" + (i + 1) + "] = " + childNodes[i].innerText);}}var parentElement = java.parentElement;alert(parentElement);//HTMLUListElement};}</script>
</head>
<body>
<div><div><p>你的編程語言:</p><ul id="language"><li id="java">Java</li><li>Python</li><li>Go語言</li></ul></div>
</div>
<div id="btnList"><div><button id="btn07">返回id=java的父節點</button></div>
</div>
</body>
</html>

獲取前后兄弟節點

html-dom08.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {var btn08 = document.getElementById("btn08");btn08.onclick = function () {var ct = document.getElementById("ct");alert(ct.previousSibling);//Text[換行符]alert(ct.previousSibling.previousSibling);//HtmlOptionElementalert(ct.previousSibling.previousSibling.innerText);//霞燕alert(ct.nextSibling);//Text[換行符]alert(ct.nextSibling.nextSibling);//HTMLOptionElementalert(ct.nextSibling.nextSibling.innerText);//秋楓};};</script>
</head>
<body>
<div><div><p>你當前的女友是誰:</p><select id="sel01"><option>--女友--</option><option>霞燕</option><option id="ct" value="春桃姑娘">春桃</option><option>秋楓</option><option>冬梅</option></select></div>
</div>
<div id="btnList"><div><button id="btn08">返回id=ct的前后兄弟節點</button></div>
</div>
</body>
</html>

設置文本域內容

html-dom09.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//設置#person的文本域var btn10 = document.getElementById("btn10");btn10.onclick = function () {var person = document.getElementById("person");person.innerText = "刀劍神域";//設置文本域}};</script>
</head>
<body>
<div><div><p>個人介紹:</p><textarea name="person" id="person">個人介紹</textarea></div>
</div>
<div id="btnList"><div><button id="btn10">設置#person的文本域</button></div>
</div>
</body>
</html>

總代碼:

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>演示HTML DOM 相關方法</title><link rel="stylesheet" type="text/css" href="style/css.css"/><script type="text/javascript">//動態注冊window.onload = function () {//查找id=java節點var btn01 = document.getElementById("btn01");//綁定onclick事件btn01.onclick = function () {var java = document.getElementById("java");alert("java節點文本 = " + java.innerText);};//查找所有option節點var btn02 = document.getElementById("btn02");btn02.onclick = function () {//id --> getElementById()//name --> getElementsByName()//元素標簽 --> getElementsByTagName()var options = document.getElementsByTagName("option");//HTMLCollectionfor (var i = 0; i < options.length; i++) {alert("options[" + (i + 1) + "] = " + options[i].innerText);}};//查找name=sport節點var btn03 = document.getElementById("btn03");btn03.onclick = function () {var sports = document.getElementsByName("sport");// alert(sports);//NodeListfor (var i = 0; i < sports.length; i++) {if (sports[i].checked) {alert("運動是 = " + sports[i].value);}}}//查找id=language下所有li節點var btn04 = document.getElementById("btn04");btn04.onclick = function () {var lis = document.getElementById("language").getElementsByTagName("li");// alert("lis=" + lis);//HTMLCollectionfor (var i = 0; i < lis.length; i++) {alert("lis[" + (i + 1) + "] = " + lis[i].innerText);}};//返回id=sel01的所有子節點var btn05 = document.getElementById("btn05");btn05.onclick = function () {//var options = document.getElementById("sel01").getElementsByTagName("option");//alert(options.length);//5 不算換行符//1. 如果使用document.getElementById("sel01").childNodes; 獲取的是[object Text],[object HTMLOptionElement]//2. 如果不希望得到 text對象, 需要將所有的內容放在一行var childNodes = document.getElementById("sel01").childNodes;//alert(childNodes);//NodeList//alert(childNodes.length);//11, 加上文本, 在這里換行符屬于文本[object Text]for (var i = 0; i < childNodes.length; i++) {//alert(childNodes[i]);//HTMLOptionElementif (childNodes[i].innerText != undefined && childNodes[i].selected) {alert("女友有 = " + childNodes[i].innerText);}}alert("===============還有一個方法===============");//1.sel01 是 HTMLSelectElement => 本身具有集合的特點var sel01 = document.getElementById("sel01");alert(sel01);//HTMLSelectElementalert(sel01[0]);//HTMLOptionElementfor (var i = 0; i < sel01.length; i++) {alert("sel01[" + (i + 1) + "] = " + sel01[i].innerText);}};//返回id=sel01 的第一個子節點var btn06 = document.getElementById("btn06");btn06.onclick = function () {var sel01 = document.getElementById("sel01");var childNodes = sel01.childNodes;alert(childNodes[0]);//object Textvar firstChild = sel01.firstChild;alert(firstChild);//object Text]alert(sel01[0]);//直接得到第一個option節點 object HTMLOptionElement}//返回id=java的父節點var btn07 = document.getElementById("btn07");btn07.onclick = function () {var java = document.getElementById("java");alert(java);//HTMLLIElementvar parentNode = java.parentNode;alert(parentNode);//HTMLUListElementalert(parentNode.innerText);alert(parentNode.innerHTML);//<li id="java">Java</li>var childNodes = parentNode.childNodes;alert(childNodes.length);//7for (var i = 0; i < childNodes.length; i++) {if (childNodes[i].innerText != undefined) {//換行符[文本]也算一個節點alert("childNodes[" + (i + 1) + "] = " + childNodes[i].innerText);}}var parentElement = java.parentElement;alert(parentElement);//HTMLUListElement};//返回id=ct的前后兄弟節點var btn08 = document.getElementById("btn08");btn08.onclick = function () {var ct = document.getElementById("ct");alert(ct.previousSibling);//Text[換行符]alert(ct.previousSibling.previousSibling);//HtmlOptionElementalert(ct.previousSibling.previousSibling.innerText);//霞燕alert(ct.nextSibling);//Text[換行符]alert(ct.nextSibling.nextSibling);//HTMLOptionElementalert(ct.nextSibling.nextSibling.innerText);//秋楓};//讀取id=ct的value屬性值var btn09 = document.getElementById("btn09");btn09.onclick = function () {var ct = document.getElementById("ct");alert(ct.value);ct.innerText = "春桃姑娘";//修改文本域};//設置#person的文本域var btn10 = document.getElementById("btn10");btn10.onclick = function () {var person = document.getElementById("person");person.innerText = "刀劍神域";//設置文本域}};</script>
</head>
<body>
<div><div><p>你喜歡的運動項目:</p><input type="checkbox" name="sport" value="soccer" checked="checked"/>足球<input type="checkbox" name="sport" value="basketball" checked="checked"/>藍球<input type="checkbox" name="sport" value="pingPang" checked="checked"/>乒乓球<hr/><p>你當前的女友是誰:</p><select id="sel01"><option>--女友--</option><option>霞燕</option><option id="ct" value="春桃姑娘">春桃</option><option>秋楓</option><option>冬梅</option></select><hr/><p>你的編程語言:</p><ul id="language"><li id="java">Java</li><li>Python</li><li>Go語言</li></ul><br/><br/><hr/><p>個人介紹:</p><textarea name="person" id="person">個人介紹</textarea></div>
</div>
<div id="btnList"><div><button id="btn01">查找id=java節點</button></div><div><button id="btn02">查找所有option節點</button></div><div><button id="btn03">查找name=sport節點</button></div><div><button id="btn04">查找id=language下所有li節點</button></div><div><button id="btn05">返回id=sel01的所有子節點</button></div><div><button id="btn06">返回id=sel01的第一個子節點</button></div><div><button id="btn07">返回id=java的父節點</button></div><div><button id="btn08">返回id=ct的前后兄弟節點</button></div><div><button id="btn09">讀取id=ct的value屬性值</button></div><div><button id="btn10">設置#person的文本域</button></div>
</div>
</body>
</html>

js dom 烏龜吃雞游戲

在這里插入圖片描述
在這里插入圖片描述

靜態注冊實現

tortoiseGame2.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>tortoise-hen碰撞游戲</title><script type="text/javascript">//公雞的坐標var hen_xPos = 200;var hen_yPos = 200;//烏龜圖片的寬度和高度var tortoise_width = 94;var tortoise_height = 67;//公雞圖片的寬度和高度var hen_width = 76;var hen_height = 73;function move(obj) {//object HTMLButtonElementvar tortoise = document.getElementById("tortoise");var tortoise_left = tortoise.style.left;//100px 值傳遞var tortoise_top = tortoise.style.top;//130px  值傳遞var tortoise_xPos = parseInt(tortoise_left.substring(0, tortoise_left.indexOf("p")));var tortoise_yPos = parseInt(tortoise_top.substring(0, tortoise_top.indexOf("p")));//通過button的 dom對象,獲取innerTextswitch (obj.innerText) {case "向上走":tortoise_yPos -= 10;tortoise.style.top =tortoise_yPos + "px";break;case "向下走":tortoise_yPos += 10;tortoise.style.top = tortoise_yPos + 'px';break;case "向左走":tortoise_xPos -= 10;tortoise.style.left = tortoise_xPos + "px";break;case "向右走":tortoise_xPos += 10;tortoise.style.left = tortoise_xPos + "px";break;}//走完之后再判斷//4.1 得到烏龜左和公雞左的距離,縱向距離y// (1)如果烏龜在公雞上面, 如果縱向距離y < 烏龜圖片的高度時, 說明它們可能在縱向發生重疊, 使用 yy 來記錄// (2) 吐過烏龜在公雞下面,如果縱向距離y < 公雞圖片的高度時, 說明它們可能在縱向發生重疊, 使用 yy 來記錄// 4.2 得到烏龜和公雞左上角的距離, 橫向距離x// (1)如果烏龜在公雞左面, 如果橫向距離x < 烏龜圖片的寬度時, 說明它們可能在橫向發生重疊, 使用 xx 來記錄// (2)如果烏龜在公雞右面, 如果橫向距離x < 公雞圖片的寬度時, 說明它們可能在橫向發生重疊, 使用 xx 來記錄var y = Math.abs(tortoise_yPos - hen_yPos);var x = Math.abs(tortoise_xPos - hen_xPos);var yy = 0;//var xx = 0;//默認橫向沒有重疊if (tortoise_yPos < hen_yPos) {//烏龜在上if (y < tortoise_height) {yy  = 1;}} else {//烏龜在下if (y < hen_height) {yy = 1;}}if (tortoise_xPos < hen_xPos) {//烏龜在左if (x < tortoise_width) {xx = 1;}} else {//烏龜在右if (x < hen_width) {xx = 1;}}if (xx && yy) {//js中 0默認是falsealert("發生碰撞");tortoise.style.left = 100 + "px";tortoise.style.top = 130 + "px";}}</script>
</head>
<body>
<table><tr><td></td><!--1.this表示的是你點擊的這個button, 而且已經是一個dom對象3.可以通過dom對象操作屬性和方法--><td><button onclick="move(this)">向上走</button><!--靜態注冊傳參 只能用單引號--></td><td></td></tr><tr><td><button onclick="move(this)">向左走</button></td><td></td><td><button onclick="move(this)">向右走</button></td></tr><tr><td></td><td><button onclick="move(this)">向下走</button></td><td></td></tr>
</table>
<img src="./img/1.bmp" id="tortoise" style="position: absolute; left: 100px; top: 130px;" border="1">
<img src="./img/2.bmp" style="position: absolute; left: 200px; top: 200px;" border="1">
</body>
</html>

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/36292.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/36292.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/36292.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

JDK-調度線程池

歸檔 GitHub: JDK-調度線程池 使用示例 https://github.com/zengxf/small-frame-demo/blob/master/jdk-demo/simple-demo/src/main/java/test/jdkapi/juc/thread_pool/TestSchedule.java JDK 版本 openjdk version "17" 2021-09-14 OpenJDK Runtime Environment…

邊緣計算VNC智能盒子如何助力HMI設備實現二次開發?

HMI&#xff08;Human-Machine Interface&#xff09;又稱人機界面&#xff0c;是用戶與機器之間交互和通信的媒介。今天帶你了解智能盒子如何助力HMI設備實現二次開發&#xff1f; HMI設備被廣泛應用在工業自動化中&#xff0c;具有顯示設備信息&#xff0c;實時監測&#xf…

python爬蟲--scrapy框架

Scrapy 一 介紹 Scrapy簡介 1.Scrapy是用純Python實現一個為了爬取網站數據、提取結構性數據而編寫的應用框架&#xff0c;用途非常廣泛2.框架的力量&#xff0c;用戶只需要定制開發幾個模塊就可以輕松的實現一個爬蟲&#xff0c;用來抓取網頁內容以及各種圖片&#xff0c;非…

GPT-5對普通人有何影響

這篇文章對ChatGPT的使用方法和提問技巧進行了討論&#xff0c;重點強調了背景信息和具體提問的重要性。文章清晰地傳達了如何提高ChatGPT回答的質量&#xff0c;以及個人在使用ChatGPT時的體會和建議。然而&#xff0c;文章在邏輯組織和表達方面還有一些可以改進的地方&#x…

Spring Boot與分布式事務的最佳實踐

Spring Boot與分布式事務的最佳實踐 大家好&#xff0c;我是免費搭建查券返利機器人省錢賺傭金就用微賺淘客系統3.0的小編&#xff0c;也是冬天不穿秋褲&#xff0c;天冷也要風度的程序猿&#xff01;今天我們來探討在Spring Boot應用中如何實現分布式事務的最佳實踐。 什么是…

Android Launcher-----MainThreadInitializedObject介紹

MainThreadInitializedObject 是 Android 開發中用于確保對象在主線程上初始化的一種設計模式 一、用途 MainThreadInitializedObject 通常用于確保那些需要在主線程上創建的對象&#xff08;比如UI組件或依賴于主線程環境的對象&#xff09;能夠安全地進行初始化 二、優點 …

LeetCode.438找到字符串中所有字母異位詞

問題描述 給定兩個字符串s和p&#xff0c;找到s中所有p的 異位詞 的子串&#xff0c;返回這些子串的起始索引。不考慮答案輸出的順序。 異位詞 指由相同字母重排列形成的字符串&#xff08;包括相同的字符串&#xff09;。 解題思路1 注意&#xff1a;該解題思路是錯誤的&am…

Microsoft VBA Excel 操控 Access資料表和查詢代碼進行搬運操作

問題場景 Run_NoSource_AddressSource_FileDestination_AddressDestination_FileCopy_IndicatorRun_Start_Time1C:\Users\EP\path\to\FileSSS-1.MDBC:\Users\EP\path\to\FileSSC-1.MDBY2C:\Users\EP\path\to\FileSSS-2.MDBC:\Users\EP\path\to\FileSSC-2.MDBY3C:\Users\EP\pat…

NC參照 根據名稱轉換為主鍵值,如部門、人員等參照根據部門名稱、人員名稱獲取對應的主鍵值

NC參照 根據名稱轉換為主鍵值&#xff0c;如部門、人員等參照根據部門名稱、人員名稱獲取對應的主鍵值 private BillCardPanel getEditBillCardPanel() {return getEditor().getBillCardPanel(); }private BillData getEditorBillData() {return this.getEditor().getBillCard…

靜態庫和動態庫

1、編譯過程 1.預處理&#xff1a;解釋并展開源程序當中的所有的預處理指令&#xff0c;此時生成 *.i 文件。 2.編譯&#xff1a;詞法和語法的分析&#xff0c;生成對應硬件平臺的匯編語言文件&#xff0c;此時生成 *.s 文件。 3.匯編&#xff1a;將匯編語言文件翻譯為對應處理…

便攜式煙氣監測儀的應用主要有哪些?

煙氣分析儀是一種用于檢測和分析煙氣中各種成分和污染物含量的儀器&#xff0c;通過采集和處理煙氣樣品&#xff0c;對其中的各種成分進行定量分析。那么&#xff0c;便攜式煙氣監測儀的應用主要有哪些&#xff1f;為方便大家了解&#xff0c;下面就讓小編來為大家簡單介紹一下…

2-2到2-4

計算出所有人的平均年齡&#xff1a; val lines sc.textFile("/root/data/scala/people/page.txt") val count lines.count() val total lines.map(line > line.split(" ")(1)).map(t>t.trim.toInt).collect().reduce((a,b)>ab) val avgAge …

如何防止SQL注入

為了防止SQL注入攻擊&#xff0c;可以采取以下一系列的安全措施&#xff0c;這些措施結合了多篇參考文章中的關鍵信息和方法&#xff1a; 使用參數化查詢或預編譯語句&#xff1a; 這是防止SQL注入的最常見且最有效的方法之一。通過將用戶輸入的數據作為參數傳遞給SQL查詢語句…

[Python]根據文件路徑獲取文件所在目錄、文件名和后綴名

一、簡介 本文介紹了在python中如何根據文件的路徑名字&#xff08;字符串&#xff09;獲取文件所在目錄名、文件名&#xff08;帶后綴&#xff09;、文件名&#xff08;無后綴&#xff09;和文件后綴名。 二、代碼 假設文件路徑為/home/user/temp.txt&#xff0c;使用以下代…

壓縮pdf文件大小的方法,如何壓縮pdf格式的大小

pdf太大怎么壓縮&#xff1f;當你需要通過電子郵件發送一個PDF文件&#xff0c;卻發現文件太大無法成功發出時&#xff0c;這些情況下&#xff0c;我們都需要找到一種方法來壓縮PDF文件&#xff0c;以便更便捷地進行分享和傳輸。PDF文件的大小通常與其中包含的圖片、圖形和文本…

入門JavaWeb之 Response 下載文件

web 服務器接收到客戶端的 http 請求 針對這個請求&#xff0c;分別創建一個代表請求的 HttpServletRequest 對象&#xff0c;代表響應的 HttpServletResponse 對象 獲取客戶端請求過來的參數&#xff1a;HttpServletRequest 給客戶端響應一些信息&#xff1a;HttpServletRe…

數據庫索引失效的11種情況

MySQL中 提高性能 的一個最有效的方式是對數據表 設計合理的索引。索引提供了高效訪問數據的方法&#xff0c;并且加快查詢的速度&#xff0c;因此索引對查詢的速度有著至關重要的影響。使用索引可以 快速地定位 表中的某條記錄&#xff0c;從而提高數據庫査詢的速度&#xff0…

js獲取選中區域(window.getSelection的基本使用)

返回一個 Selection 對象&#xff0c;表示用戶選擇的文本范圍或光標的當前位置。 const selection window.getSelection() 1.toString() //光標選中的文本 const selectedText selection.toString() 2.getRangeAt() //返回一個包含當前選區內容的區域對象。 selection…

數據與文字的表示方法

目錄 1. 數據格式 1. 文本文件格式 2. 二進制文件格式 3. 數據庫格式 4. 壓縮格式 2. 數字機器碼表示 整數表示 浮點數表示 3. 字符與數組的表示方法 1. ASCII&#xff08;美國信息交換標準代碼&#xff09; 2. 擴展ASCII 3. Unicode 4. UTF-8&#xff08;8 位 Uni…

面試相關-接口測試常問的問題

1.為什么要做接口測試 (1)現在大多系統都是前后端分離的項目,前端和后端的進度可能不一樣,那為了盡早的進入測試,前端界面沒有開發完成的情況下,只要后端的接口開發完了,就可以提前做接口測試了; (2)基于安全考慮,只依賴前端進行限制,已經完全不滿足系統的安全性…