首页 > 编程语言 >DOM编程

DOM编程

时间：2023-08-08 21:59:16浏览次数：73  
标签：function 编程 DOM 元素 getElementById let document 节点

DOM编程

介绍

  • DOM编程是指使用JavaScript与HTML文档中的DOM（文档对象模型）进行交互的过程。

    • 文档：整个HTML网页文档
    • 对象：网页中的每一部分都转换为了对象
    • 模型：使用模型表示对象之间的关系

  • DOM是HTML文档的树状结构表示，它允许开发者使用JavaScript来访问、操作和修改HTML元素、属性和样式。

  • 通过DOM编程，开发者可以动态地创建、删除、修改和移动HTML元素，以及响应用户的交互事件。

  • 节点：Node--构成HTML文档最基本的单元

    • 常用节点:
      • 文档：整个HTML文档
      • 元素：HTML文档中的HTML标签
      • 属性：元素的属性
      • 文本：HTML中的文本内容(根据DOM标准，标签间的空白也算文本节点)

获取对象

  • document.getElementById() 可以通过id获取对象
<button id="btn">这是一个按钮</button>  
  
<script type="text/javascript">  
    //获取button对象  
    let  btn = document.getElementById("btn");  
    console.log(btn);  
    //修改按钮的文字  
    btn.innerHTML = "修改后的文字";  
  
</script>

事件

  • 事件是指在特定条件或用户操作发生时触发的动作或通知。
  • 事件可以是用户与程序交互的结果，例如点击按钮、输入文本、滚动页面等，也可以是程序内部的状态变化，例如定时器到期、数据加载完成等。
  • 在HTML中，可以通过使用事件属性或事件监听器来处理事件。
    1. 事件属性：可以直接在HTML元素上使用事件属性来指定事件处理程序。
    • 常见的事件属性包括onclick(单击)、ondblclick(双击)、onmouseover、onkeydown等。
<button onclick="myFunction()">点击我</button>
<--点击后调用myFunction() -->

<button id="btn">点击我</button>
<script type="text/javascript">
//事件属性绑定回调函数
let btn = document.getElementById("btn");
btn.onclick = function(){
alert("你还真点了?");
}
</script>

2. 事件监听器：可以使用JavaScript代码来动态地添加事件监听器。通过这种方式，可以将事件处理程序与HTML元素分离，使代码更加清晰和可维护。常见的事件监听器方法包括addEventListener和attachEvent（用于旧版本的IE）。例如，要在按钮被点击时执行一个函数，可以使用addEventListener方法：

<button id="myButton">点击我</button>
<script type="text/javascript">
document.getElementById("myButton").addEventListener("click", myFunction);
</script>

文档加载

  • 浏览器从上到下加载页面
  • 将js代码写到下面就是为了先加载完页面在执行js代码
  • window.onload事件在整个页面加载完成后触发
<script type="text/javascript">  
  window.onload = function () {  
    let btnElt = document.getElementById("btn");  
    btnElt.onclick = function () {  
      let value = document.getElementById("username").value;  
      alert(value);  
    }  
  }  
</script>  
  
<input type="text" id="username">  
<input type="button" value="获取文本框的value" id="btn">

DOM查询

通过document

  • 通过document对象调用获取元素节点
    • getElementById 通过id属性获取一个元素节点对象
    • getElementsByTagName 通过标签名获取一组元素节点对象
    • getElementsByName 通过name属性获取一组元素节点对象
    • querySelector或querySelectorAll方法通过CSS选择器来获取元素节点。querySelector方法返回匹配选择器的第一个元素节点，而querySelectorAll方法返回匹配选择器的所有元素节点的对象集合。
    • 获取body标签: document.getElementsByTagName("body")[0]或document.body
    • 获取html根标签：document.documentElement
    • 获取页面所有元素：document.all或document.getElementsByTagName("*")
    • 通过class属性获取一组元素节点：document.getElementsByClassName("box")(IE8以下不兼容)或document.querySelector(".box")
  • 如果要读取元素节点的属性,直接使用 元素.属性名 即可。class属性除外，需要使用 元素.calssName
<div id="myDiv">这是一个div元素</div>
<script type="text/javascript">  
let element = document.getElementById("myDiv");
</script>  

<p>这是一个段落</p>
<p>这是另一个段落</p>
<script type="text/javascript">  
let elements = document.getElementsByTagName("p");
</script>  

<input type="text" name="myInput" value="value">
<script type="text/javascript">  
let elements = document.getElementsByName("myInput");
//如果要读取元素节点的属性,直接使用 元素.属性名 即可。class属性除外，需要使用 元素.calssName
alerrt(myInput[0].value);
</script>  

<div class="box1" id="#myDiv">
<div class="div1">这是一个div元素</div>
<div class="div2">这是另一个div元素</div>
</div>

<script type="text/javascript">  
//查找id为myDiv的元素下第一个div
let element = document.querySelector("#myDiv div");
//查找class为box1的元素下所有div
let elements = document.querySelectorAll(".box1 div");
</script>
  • innrtHTML和innerText
    • innerHTML属性用于获取或设置元素的HTML内容。它返回一个字符串，包含元素的所有HTML标记和文本内容。通过设置innerHTML属性，可以动态地修改元素的内容，包括添加、删除或修改HTML标记和文本。
    • innerText属性用于获取或设置元素的纯文本内容，即不包含任何HTML标记。它返回一个字符串，只包含元素的文本内容，而不包括HTML标记。通过设置innerText属性，可以动态地修改元素的文本内容。
<div id="myDiv">Hello <strong>World</strong></div>
<script type="text/javascript"> 
let element = document.getElementById("myDiv");
console.log(element.innerHTML); 
// 输出：Hello <strong>World</strong>
element.innerHTML = "Goodbye";
</script>  

<div id="myDiv2">Hello <strong>World</strong></div>
<script type="text/javascript"> 
let element = document.getElementById("myDiv2");
console.log(element.innerText); 
// 输出：Hello World
element.innerText = "Goodbye";
</script>

通过具体元素

  • 通过子节点
    • getElementsByTagName()方法，返回当前节点的指定标签名后代节点(与document.getElementsByTagName()获取页面所有节点相比，具体元素.getElementsByTagName()只获取具体元素节点下的节点)
    • childNodes 属性，表示当前节点的所有子节点,包括文本节点
    • children 属性，表示当前节点的所有子节点,不包括文本节点
    • firstChild属性，表示当前节点的第一个子节点，包括空白文本节点
    • firstElementChild属性，表示当前节点的第一个子元素，不包括空白文本节点。注意该属性IE8以下不兼容。
    • lastChild属性，表示当前节点的最后一个子节点，包括空白文本节点
<div id="myDiv">  
  <p id="p1">你居住的城市?</p>  
  <ul id="city">  
    <li id="bj">北京</li>  
    <li>上海</li>  
    <li>广州</li>  
  </ul>  <p>你使用的手机品牌?</p>  
  <ul id="phone">  
    <li id="mi">小米</li>  
    <li id="apple">苹果</li>  
    <li >三星</li>  
  </ul>  <button type="button" id="btn1">getElementsByTagName</button>  
  <button type="button" id="btn2">childNodes</button>  
  <button type="button" id="btn3">children</button>  
  <button type="button" id="btn4">firstChild</button>  
  <button type="button" id="btn5">lastChild</button>  
</div>

 window.onload = function () {  
// 通过具体元素节点调用  
  //1.getElementsByTagName()方法，返回当前节点的指定标签名后代节点  
      document.getElementById("btn1").addEventListener("click", function() {  
        let descendants = document.getElementById("city").getElementsByTagName("*");  
        alert("city的后代节点，包括空文本节点：" + descendants.length);  
      });  
  
      //2.childNodes 属性，表示当前节点的所有子节点,包括文本节点  
      document  .getElementById("btn2").addEventListener("click", function() {  
        let childNodes = document.getElementById("city").childNodes;  
        let count = 0;  
        for (let i = 0; i < childNodes.length; i++) {  
          if (childNodes[i].nodeType !== 3) {//nodeType==3是文本类型  
            count++;  
          }  
        }  
        alert("city的所有子节点的数量，不包括文本节点：" + count);  
      });  
      //3.children属性，表示当前节点的所有子节点,不包括文本节点  
      document.getElementById("btn3").addEventListener("click", function() {  
        let children = document.getElementById("phone").children;  
        alert("phone的所有子节点的数量，不包括文本节点：" + children.length);  
      });  
      //4.firstChild属性，表示当前节点的第一个子节点  
      document.getElementById("btn4").addEventListener("click", function() {  
        let firstChild = document.getElementById("phone").firstChild;  
        alert("phone的第一个子节点：" + firstChild.nodeName);  
      });  
  
      //5.lastChild属性，表示当前节点的最后一个子节点  
      document.getElementById("btn5").addEventListener("click", function() {  
        let lastChild = document.getElementById("phone").lastChild;  
        alert("phone的最后一个子节点：" + lastChild.nodeName);  
      });  
  
    }

ul {  
  display: flex;  
  list-style-type: none;  
}  
li {  
  margin-right: 10px;  
}
  • 通过父节点和兄弟节点
    • parentNode 属性，返回指定节点的父节点，无论父节点是什么类型（可以是元素节点、文本节点、注释节点等）。
    • parentElement 属性，返回指定元素节点的父元素节点。如果父节点不是元素节点，则返回null。
    • previousSibling 属性，获取当前节点的前一个兄弟节点，无论兄弟节点是什么类型（可以是元素节点、文本节点、注释节点等）。
    • previousElementSibling 属性，获取当前节点的前一个兄弟元素。IE8以下不支持
    • nextSibling 属性，获取当前节点的后一个兄弟节点，无论兄弟节点是什么类型（可以是元素节点、文本节点、注释节点等）。
    • nextElementSibling 属性，获取当前节点的后一个兄弟元素。IE8以下不支持。
<div id="myDiv">  
  <p id="p1">你居住的城市?</p>  
  <ul id="city">  
    <li id="bj">北京</li>  
    <li>上海</li>  
    <li>广州</li>  
  </ul>  <p>你使用的手机品牌?</p>  
  <ul id="phone">  
    <li id="Mi">小米</li>  
    <li id="Apple">苹果</li>  
    <li id="Samsung">三星</li>  
  </ul>  <button type="button" id="btn1">parentNode</button>  
  <button type="button" id="btn2">previousSibling</button>  
  <button type="button" id="btn3">nextSibling</button>  
  </div>

//定义一个函数，专门来指定元素单击响应函数  
function myClick(elmId,fun) {  
    let btn = document.getElementById(elmId);  
    btn.onclick = fun;  
}  
  
window.onload = function () {  
    //为id为bj的节点的父节点city，绑定单击响应函数  
    myClick("btn1",function () {  
        let bj = document.getElementById("bj");  
        // let bjPn = bj.parentNode;  
        let bjPn = bj.parentElement;  
        alert(bjPn.innerText);  
    })  
  
    //为id为Apple的前一个兄弟节点绑定单击相应函数  
    myClick("btn2",function () {  
        let apple = document.getElementById("Apple");  
        // let ps = apple.previousSibling;  
        let ps = apple.previousElementSibling;  
        alert(ps.innerText);  
    })  
  
    myClick("btn3",function () {  
        let apple = document.getElementById("Apple");  
        // let ns = apple.nextSibling;  
        let ns = apple.nextElementSibling;  
        alert(ns.innerText);  
    })  
}

DOM增删改

  1. 增加元素：

    • createElement方法，创建新的HTML元素。需要一个标签名作为参数，会根据标签名创建节点对象
    • createTextNode方法，创建新的文本节点。需要一个文本作为参数。
    • appendChild方法，向父节点添加新的子节点。语法:父节点.appendChild(新子节点)
    • insertBefore方法，向指定子节点前面插入新的子节点。语法:父节点.insertBefore(新子节点,指定子节点)
    • repaceChild方法，替换子节点。语法：父节点.repaceChild(新子节点,旧子节点)

  2. 删除元素：

    • removeChild方法，删除子节点。语法：父节点.repaceChild(子节点)。
    • 可以使用指定子节点.parentNode.removeChild(指定子节点)来删除不知道父节点的子节点。该方法更常用。

  3. 修改元素：

    • setAttribute方法，改变元素的属性。
    • innerHTML方法，也可以改变元素属性。此外，该方法也可以实现DOM的增删改，但是建议与前面的方法结合使用。
<div class="box1">  
  <ul id="city">  
    <p>你喜欢那个城市？</p>  
    <li id="bj">北京</li>  
    <li>上海</li>  
    <li id="dj">东京</li>  
    <li id="hsd">华盛顿</li>  
  </ul></div>  
<div class="box2">  
  <ul id="btn">  
    <li><button type="button" id="btn1">创建一个“广州”节点，添加到#city下</button> </li>  
    <li><button type="button" id="btn2">将“广州”节点插入到#bj前</button> </li>  
    <li><button type="button" id="btn3">使用“广州”节点替换#dj</button> </li>  
    <li><button type="button" id="btn4">删除#hsd节点</button> </li>  
    <li><button type="button" id="btn5">读取#city内的HTML代码</button> </li>  
  </ul></div>

//创建单击响应函数  
function myClick(btnId,fun) {  
    let btn = document.getElementById(btnId);  
    btn.onclick = fun;  
}  
  
window.onload = function () {  
    //创建一个“广州”节点，添加到#city下  
        //1. 为按钮绑定单击响应函数  
    myClick("btn1",function () {  
        //2.创建广州节点  
        let gz = document.createElement('li');  
        //3. 创建广州文本节点  
        let gzText = document.createTextNode("广州");  
        //4. 为广州节点绑定文本子节点  
        gz.appendChild(gzText);  
        //也可以直接修改gz节点的innerHTML或innerText  
        // gz.innerHTML = "广州";  
        //5. 为#city绑定广州子节点  
        let city = document.getElementById("city");  
        city.appendChild(gz);  
    })  
  
//    将“广州”节点插入到#bj前  
        //1. 为按钮绑定单击响应函数  
    myClick("btn2",function () {  
        //2.创建广州节点  
        let gz = document.createElement("li");  
        //3.设置gz的文本内容  
        gz.innerText = "广州";  
        //4. 获取#bj节点  
        let bj = document.getElementById("bj");  
        //5. 将gz插入在#bj前  
        bj.parentNode.insertBefore(gz,bj);  
    })  
  
// 使用“广州”节点替换#dj  
    myClick("btn3",function () {  
        //2.创建广州节点  
        let gz = document.createElement("li");  
        //3.设置gz的文本内容  
        gz.innerText = "广州";  
        //4. 获取#bj节点  
        let dj = document.getElementById("dj");  
        //5. 将gz替换#dj  
        dj.parentNode.replaceChild(gz,dj);  
    })  
  
// 删除#hsd节点  
    myClick("btn4",function () {  
        //获取#hsd节点  
        let hsd = document.getElementById("hsd");  
        //删除  
        hsd.parentNode.removeChild(hsd);  
    })  
    // 读取#city内的HTML代码  
    myClick("btn5",function () {  
        let city = document.getElementById("city");  
        alert(city.innerHTML);  
    })  
      
}

DOM操作CSS

读取和修改内联样式

  • 元素.style.样式名=样式值通过js修改元素内联样式，因为内联样式显示优先级较高，就覆盖了样式表中的样式。但是如果原样式有!important关键字则js修改样式无效，因此尽量不要为样式使用该关键字。
  • 如果css样式名中含有-，需要将该样式修改为驼峰命名法。例如background-color修改为backgroundColor
box1.style.width = "300px";//将box1的width修改为300px

box1.style.backgroundColor = "blue";//修改box1的颜色

alert(box1.style.width);//读取内联样式
  • 元素.style.样式名也可以读取元素的内联样式

读取和修改样式

  • getComputedStyle方法可以读取元素的当前样式
    • 语法getComputedStyle(要获取的元素,伪元素/null)。
    • 该方法返回一个对象，封装了当前元素对应样式。
    • 可以通过对象.样式名获取样式，如果获取的样式没有设置，会返回一个真实值，如width不会返回auto，而是实际的值。IE8以下不支持。
  • 元素.currentStyle.样式名可以读取元素的当前样式,只有IE支持。
  • 以上方法/属性获取的样式都是只读的，要修改必须通过style属性
function getStyle(obj,name) {  
    //普通浏览器  
if (window.getComputedStyle){  //属性为找到返回undified
    return getComputedStyle(obj,null)[name];  
}else {  
    //IE8  
    return obj.currentStyle[name];  
}  
  
}
  • clientWidth和clientHeight可以获取元素的可见宽度和高度，包括内容区和内边距，只读不可修改。
  • offsetWidth和offsetHeight 可以获取元素的整个宽度和高度，包括内容区和内边距和边框，只读不可修改。
  • offsetParent获取当前元素的开启了定位的祖先元素(默认为body)
  • offsetLeft获取当前元素相对于开启了定位的祖先元素的水平偏移量，offsetTop获取当前元素相对于开启了定位的祖先元素的垂直偏移量
  • scrollHeight和scrollWidth获取当前元素整个滚动区域高度和宽度(谷歌浏览器认为浏览器的滚动条是body的，火狐等浏览器认为是html的)
  • scrollLeft和scrollTop获取当前元素水平滚动条滚动的距离和宽度
  • 垂直滚动条滚动到底满足:scrollHeight - scrollTop == clientHeight。可应用于协议，只有当协议全部阅读完(滚动到底)，才可以使用。推荐使用：parseInt(this.scrollHeight - this.scrollTop) == this.clientHeight，因为某些浏览器存在误差。
let box1 = document.getElementById('box1');
  console.log(box1.clientWidth);//获取可见宽度
  console.log(box1.offsetWidth);//获取全部宽度
  console.log(box1.offsetParent);//获取定位的祖先元素

练习

1 图片切换

  • 要求
    • 当点击按键时切换图片
    • 实现4张图片的循环切换
    • info显示共几张和当前是第几张图片
<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <title>练习1-图片切换</title>  
  <style type="text/css">  
    *{  
      margin: 0;  
      padding: 0;  
    }  
  
    #outer{  
      width: 476px;  
      margin: 50px auto;  
      padding: 10px;  
      background-color: #bbffaa;  
      text-align: center;  
    }  
  
  </style>  
  
  <script type="text/javascript">  
    //要切换图片就是要修改img标签的src  
  //  可以使用数组保存图片的路径  
  //  使用变量保存当前索引  
  //点击按钮后，重新设置信息
  </script>  
</head>  
<body>  
<div id="outer">  
  <p id="info">一共 4 张图片，当前第  张</p>  
  <img src="img/bomb_0.png" alt="bomb1"/>  
  <button type="button" id="prev">上一张</button>  
  <button type="button" id="next">下一张</button>  
</div>  
</body>  
</html>

2 全选练习

  • 要求
    • 当点击全选，所有多选框都选择；当点击全不选，所有多选都不选
    • 当点击反选，选择之前选择的剩余未选择的
<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <title>练习2 全选练习</title>  
  <style type="text/css">  
    input[type="checkbox"] {  
      display: inline-block;  
      margin-right: 10px;  
    }  
  </style>  
  <script type="text/javascript" src="../js/练习2-全选练习.js"></script>  
</head>  
<body>  
<form id="sport">  
  <p>你爱好的运动是?</p>  
  <input type="checkbox" name="sport" value="足球" id="football">足球  
  <input type="checkbox" name="sport" value="篮球" id="basketball">篮球  
  <input type="checkbox" name="sport" value="乒乓球" id="pingpong">乒乓球  
  <input type="checkbox" name="sport" value="羽毛球" >羽毛球<br>  
</form>  
<button type="button" id="btn1">全选</button>  
<button type="button" id="btn2">全不选</button>  
<button type="button" id="btn3">反选</button>  
<button type="button" id="btn4">提交</button>  
</body>  
</html>
  • 答案
//创建绑定函数  
function myClick(elemId,fun) {  
    let btn =  document.getElementById(elemId);  
    btn.onclick = fun;  
}  
window.onload = function () {  
    let elem1 = document.getElementById("football");  
    let elem3 = document.getElementById("pingpong");  
    let elem2 = elem3.previousElementSibling;  
    let elem4 = elem3.nextElementSibling;  
    // alert(elem2.innerHTML);  
    // alert(elem4.innerHTML);
    let elemArr = [elem1,elem2,elem3,elem4];  
  
//      全选  
    myClick("btn1",function () {  
        for (let i = 0; i < elemArr.length; i++) {  
            elemArr[i].checked = true;  
        }  
    })  
//    全不选  
    myClick("btn2",function () {  
        for (let i = 0; i < elemArr.length; i++) {  
            elemArr[i].checked = false;  
        }  
    })  
//    反选  
    myClick("btn3",function () {  
        for (let i = 0; i < elemArr.length; i++) {  
            if (elemArr[i].checked){  
                elemArr[i].checked = false;  
            }else {  
                elemArr[i].checked = true;  
            }  
        }  
    })  
}

3 表单的增删改

  • 要求：
    • 当点击Delete，提示是否真的删除。点击确定，删除，点击取消，不删除。
    • 在name、email、salary中填写内容，点击submit后，添加记录

4 霸王条款

  • 要求:
    • 只有当协议滚动到最底两个按钮才可以使用
    <style>
        h3{
            font-size: 20px;
        }
        #info{
            font-size: 14px;
            width: 300px;
            height: 500px;
            overflow: auto;
            background-color: #bfa;
        }
    </style>
    <script type="text/javascript" >
        window.onload = function(){
            let info = document.getElementById("info");
        info.onscroll = function(){
            if (this.scrollHeight - this.scrollTop == this.clientHeight) {
              //disabled属性可以设置禁用一个表单控件，
            //   如果为true, 则该表单控件被禁用，
            //   如果为false，则该表单控件可用
                inputs[0].disabled = false;
                inputs[1].disabled = false;
            }
        }
    }
    </script>
    <h3>用户注册</h3>
    <p id="info">
	省略很多字
    </p>
    <input type="checkbox" name="" id="read" disabled="disabled">我已同意以上协议</input>
    <input type="submit" name="" id="sub" disabled="disabled">同意协议并注册</input>

标签：function,编程,DOM,元素,getElementById,let,document,节点
From： https://www.cnblogs.com/flblogs/p/17615466.html

相关文章

  • CANoe：Communication Object编程基础
    引言  基于SOA的功能测试中，Someip作为核心至关重要，但是常规的功能测试（不包括协议栈）针对SomeipSD并不十分关注，用SomeipDLL实现也很麻烦。CANoe12.0版本提出了CO：CommunicationObject，CO将Someip的服务与方法抽象为具体的单独的接口来供测试工程师使用，极大降低了测试难度。本文章......
  • BOM 编程
    BOM编程介绍BOM(浏览器对象模型):可以通过js操作浏览器分类window代表浏览器的窗口，也是浏览器的全局对象document代表当前加载的html文档navigator浏览器的信息，可以获取浏览器的版本location浏览器的地址栏信息，可以获取地址信息，或操作浏览器跳转页面histor......
  • 《Java编程思想第四版》学习笔记07
    到底应该使用一个接口还是一个抽象类呢？若使用接口，我们可以同时获得抽象类以及接口的好处。所以假如想创建的基础类没有任何方法定义或者成员变量，那么无论如何都愿意使用接口，而不要选择抽象类。事实上，如果事先知道某种东西会成为基础类，那么第一个选择就是把它变成一个接口。只有在必......
  • 软件测试|Python random模块，超乎想象的强大
    Python的random模块是一个非常强大的工具，用于生成随机数和随机选择。它提供了许多函数和方法，可以满足各种随机化需求。本文将介绍random模块的基本功能和常见用法，以帮助读者更好地理解和利用这个模块。返回整数random.randange()语法如下：random.randrange(stop)random.randrange(s......
  • CodeSys PLC编程指南（ST语言）@Like
    CodeSysPLC编程指南（ST语言）@Like 目录1.软件编程1.1.PLC编程基本概念1.1.1.字符集1.1.2.分界符1.1.3.关键字1.1.4.常数1.1.5.操作数1.1.6.变量1.1.7.数据类型1.1.8.匈牙利命名法1.1.9.变量的类型1.2.ST语言简介1.2.1.执行顺序1.2.2.语句1.3.CODE......
  • 掌握.NET多线程编程技术
    当涉及到处理并发任务、提高程序性能以及充分利用多核处理器时，.NET多线程编程技术就变得至关重要。在本篇博客中，我将为您介绍一些.NET多线程编程的基本概念和技术，并附上一些示例代码来帮助您更好地理解。为什么使用多线程编程？多线程编程允许在同一进程中同时执行多个线程，从而充分利......
  • STC15 外部中断编程笔记
    以STC15W4K58S4为例，可以将片上的外部中断资源分为“高级”和“低级”两类，EXINT0和EXINT1属于高级的，EXINT2~EXINT4属于低级的。“高级”的外部中断可以配置中断优先级，选择中断源；低级的则不行。EXINT0和EXINT1的配置这两个外部中断的配置寄存器都可位寻址，因此可以直......
  • java多线程编程基础4--正确使用 Volatile 变量
    记住一点就是：对数据的操作是分三步：1.从内存从拿过来2.更改数据3.写入内存 还需要记住一点就是：我们在存储数据的时候，不一定是将数据存放在内存中的，有时放在寄存器中的。所以多线程操作的时候，共有变量A如果被一个线程操作，并且存放在寄存器中并没写入到内存中，而另一个线程操作这个......
  • 4.深度学习(1) --神经网络编程入门
    ✅作者简介：热爱科研的算法开发者，Python、Matlab项目可交流、沟通、学习。......
  • Go的任务调度单元与并发编程
    摘要：本文由葡萄城技术团队于博客园原创并首发。转载请注明出处：葡萄城官网，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。前言本文主要介绍Go语言、进程、线程、协程的出现背景原因以及Go语言如何解决协程的问题和并发编程的实现，本文的阅读时长约在15-20分钟......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99