Javascript DOM Document|Element|Attribute对象方法详解

      HTML DOM 定义了访问和操作 HTML 文档的标准方法。DOM 将 HTML 文档表达为树结构。在 HTML DOM 中,所有事物都是节点。DOM 是被视为节点树的 HTML。通过 HTML DOM,树中的所有节点均可通过 JavaScript 进行访问。所有 HTML 节点均可被修改,也可以创建或删除节点。

一、DOM 节点
根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点:
整个文档是一个文档节点
每个 HTML 元素是元素节点
HTML 元素内的文本是文本节点
每个 HTML 属性是属性节点
注释是注释节点

Javascript DOM Document|Element|Attribute对象方法详解_第1张图片
      

      节点树中的节点彼此拥有层级关系。父(parent)、子(child)和同胞(sibling)等术语用于描述这些关系。父节点拥有子节点。同级的子节点被称为同胞(兄弟或姐妹)。

在节点树中,顶端节点被称为根(root)
每个节点都有父节点、除了根(它没有父节点)
一个节点可拥有任意数量的子节点
同胞是拥有相同父节点的节点

请看下面的 HTML 片段:


  
    DOM 教程
  
  
    

DOM 第一课

Hello world!

从上面的 HTML 中:
节点没有父节点;它是根节点
和 的父节点是 节点
文本节点 "Hello world!" 的父节点是

节点
并且:
节点拥有两个子节点: 和
节点拥有一个子节点: 节点</span> <br> <span style="font-size:14px;color:#ff0000;"><strong><title> 节点也拥有一个子节点:文本节点 "DOM 教程"</strong></span> <br> <span style="font-size:14px;"><h1> 和 <p> 节点是同胞节点,同时也是 <body> 的子节点</span> <br> <span style="font-size:14px;">并且:</span> <br> <span style="font-size:14px;"><head> 元素是 <html> 元素的首个子节点</span> <br> <span style="font-size:14px;"><body> 元素是 <html> 元素的最后一个子节点</span> <br> <span style="font-size:14px;"><h1> 元素是 <body> 元素的首个子节点</span> <br> <span style="font-size:14px;"><p> 元素是 <body> 元素的最后一个子节点</span> <p><span style="font-family:'Microsoft YaHei';"><span style="font-size:14px;"><a href="http://img.e-com-net.com/image/info8/1185f3822088416b805df1d8102cf287.gif" target="_blank"><img src="http://img.e-com-net.com/image/info8/1185f3822088416b805df1d8102cf287.gif" alt="Javascript DOM Document|Element|Attribute对象方法详解_第2张图片" width="381" height="255" style="border:1px solid black;"></a><br></span></span></p> <p><span style="font-family:'Microsoft YaHei';"><span style="font-size:14px;"><br></span></span></p> <p><span style="font-family:'Microsoft YaHei';font-size:18px;color:#cc33cc;"><strong>二、Document</strong></span></p> <p><span style="font-family:'Microsoft YaHei';font-size:14px;">      Document对象是浏览器Window(窗口)对象的一个主要部分。它包含了网页显示的各个元素,是最常用的对象之一。通过document对象可以访问HTML文档中包含的任何HTML标记,并可以动态地改变HTML标记中的内容,如表单、图像、表格和超链接等。</span></p> <p><span style="font-family:'Microsoft YaHei';font-size:14px;"><a href="http://img.e-com-net.com/image/info8/d85aeb22f6304f6c8ba75f2508cdfdc9.png" target="_blank"><img src="http://img.e-com-net.com/image/info8/d85aeb22f6304f6c8ba75f2508cdfdc9.png" alt="Javascript DOM Document|Element|Attribute对象方法详解_第3张图片" width="599" height="413" style="border:1px solid black;"></a><br></span></p> <p><span style="font-family:'Microsoft YaHei';font-size:14px;"><br></span></p> <p><span style="font-family:'Microsoft YaHei';font-size:14px;"></span></p> <div style="border-width:1px 0px;border-top-style:solid;border-bottom-style:solid;border-top-color:rgb(170,170,170);border-bottom-color:rgb(170,170,170);font-family:Verdana, Arial, '宋体';"> <h2 style="border:0px;font-family:'微软雅黑';"><span style="font-size:18px;color:#cc33cc;">Document 对象集合</span></h2> <table class="dataintable" style="border:1px solid rgb(170,170,170);border-collapse:collapse;"> <tbody style="border:0px;"> <tr style="border:0px;"> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;width:190px;"> 集合</th> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;"> 描述</th> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> all[]</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 提供对文档中所有 HTML 元素的访问。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> anchors[]</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回对文档中所有 Anchor 对象的引用。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> applets</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回对文档中所有 Applet 对象的引用。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> forms[]</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回对文档中所有 Form 对象引用。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> images[]</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回对文档中所有 Image 对象引用。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> links[]</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回对文档中所有 Area 和 Link 对象引用。</td> </tr> </tbody> </table> </div> <div style="border-width:1px 0px;border-top-style:solid;border-bottom-style:solid;border-top-color:rgb(170,170,170);border-bottom-color:rgb(170,170,170);font-family:Verdana, Arial, '宋体';"> <h2 style="border:0px;font-family:'微软雅黑';"><span style="font-size:18px;color:#cc33cc;"><br></span></h2> <h2 style="border:0px;font-family:'微软雅黑';"><span style="font-size:18px;color:#cc33cc;">Document 对象属性</span></h2> <table class="dataintable" style="border:1px solid rgb(170,170,170);border-collapse:collapse;"> <tbody style="border:0px;"> <tr style="border:0px;"> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;width:190px;"> 属性</th> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;"> 描述</th> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> body</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> <p style="border:0px;line-height:18px;"> 提供对 <body> 元素的直接访问。</p> <p style="border:0px;line-height:18px;"> 对于定义了框架集的文档,该属性引用最外层的 <frameset>。</p> </td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> cookie</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回与当前文档有关的所有 cookie。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> domain</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回当前文档的域名。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> lastModified</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回文档被最后修改的日期和时间。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> referrer</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回载入当前文档的文档的 URL。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> title</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回当前文档的标题。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> URL</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回当前文档的 URL。</td> </tr> </tbody> </table> </div> <div style="border-width:1px 0px;border-top-style:solid;border-bottom-style:solid;border-top-color:rgb(170,170,170);border-bottom-color:rgb(170,170,170);font-family:Verdana, Arial, '宋体';"> <h2 style="border:0px;font-family:'微软雅黑';"><span style="font-size:18px;color:#cc33cc;"><br></span></h2> <h2 style="border:0px;font-family:'微软雅黑';"><span style="font-size:18px;color:#cc33cc;">Document 对象方法</span></h2> <table class="dataintable" style="border:1px solid rgb(170,170,170);border-collapse:collapse;"> <tbody style="border:0px;"> <tr style="border:0px;"> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;width:190px;"> 方法</th> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;"> 描述</th> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> close()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 关闭用 document.open() 方法打开的输出流,并显示选定的数据。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> getElementById()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回对拥有指定 id 的第一个对象的引用。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> getElementsByName()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回带有指定名称的对象集合。</td> </tr> <tr style="border:0px;"> <td class="no_wrap" style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> getElementsByTagName()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回带有指定标签名的对象集合。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> open()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> write()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 向文档写 HTML 表达式 或 JavaScript 代码。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> writeln()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 等同于 write() 方法,不同的是在每个表达式之后写一个换行符。</td> </tr> </tbody> </table> </div> <br> <p></p> <p><span style="font-family:'Microsoft YaHei';"><strong><span style="font-size:18px;color:#cc33cc;">三、Element 对象</span></strong><br><span style="font-size:14px;">在 HTML DOM 中,Element 对象表示 HTML 元素。</span><span style="font-size:14px;">Element 对象可以拥有类型为元素节点、文本节点、注释节点的子节点。N</span><span style="font-size:14px;">odeList 对象表示节点列表,比如 HTML 元素的子节点集合。</span></span></p> <p><span style="font-family:'Microsoft YaHei';"><span style="font-size:14px;"></span></span> </p> <table class="dataintable" style="border:1px solid rgb(170,170,170);border-collapse:collapse;color:rgb(0,0,0);font-family:Verdana, Arial, '宋体';font-size:12px;"> <tbody style="border:0px;"> <tr style="border:0px;"> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;"> 属性 / 方法</th> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;"> 描述</th> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.accessKey</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的快捷键。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.appendChild()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 向元素添加新的子节点,作为最后一个子节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.attributes</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素属性的 NamedNodeMap。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.childNodes</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素子节点的 NodeList。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.className</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的 class 属性。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.clientHeight</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的可见高度。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.clientWidth</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的可见宽度。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.cloneNode()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 克隆元素。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.compareDocumentPosition()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 比较两个元素的文档位置。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.contentEditable</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的文本方向。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.dir</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的文本方向。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.firstChild</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的首个子。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.getAttribute()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素节点的指定属性值。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.getAttributeNode()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回指定的属性节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.getElementsByTagName()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回拥有指定标签名的所有子元素的集合。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.getFeature()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回实现了指定特性的 API 的某个对象。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.getUserData()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回关联元素上键的对象。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.hasAttribute()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 如果元素拥有指定属性,则返回true,否则返回 false。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.hasAttributes()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 如果元素拥有属性,则返回 true,否则返回 false。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.hasChildNodes()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 如果元素拥有子节点,则返回 true,否则 false。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.id</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的 id。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.innerHTML</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的内容。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.insertBefore()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 在指定的已有的子节点之前插入新节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.isContentEditable</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的内容。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.isDefaultNamespace()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 如果指定的 namespaceURI 是默认的,则返回 true,否则返回 false。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.isEqualNode()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 检查两个元素是否相等。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.isSameNode()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 检查两个元素是否是相同的节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.isSupported()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 如果元素支持指定特性,则返回 true。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.lang</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的语言代码。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.lastChild</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的最后一个子元素。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.namespaceURI</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的 namespace URI。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.nextSibling</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回位于相同节点树层级的下一个节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.nodeName</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的名称。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.nodeType</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的节点类型。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.nodeValue</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素值。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.normalize()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 合并元素中相邻的文本节点,并移除空的文本节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.offsetHeight</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的高度。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.offsetWidth</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的宽度。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.offsetLeft</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的水平偏移位置。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.offsetParent</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的偏移容器。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.offsetTop</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的垂直偏移位置。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.ownerDocument</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的根元素(文档对象)。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.parentNode</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的父节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.previousSibling</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回位于相同节点树层级的前一个元素。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.removeAttribute()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 从元素中移除指定属性。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.removeAttributeNode()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 移除指定的属性节点,并返回被移除的节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.removeChild()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 从元素中移除子节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.replaceChild()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 替换元素中的子节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.scrollHeight</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的整体高度。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.scrollLeft</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素左边缘与视图之间的距离。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.scrollTop</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素上边缘与视图之间的距离。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.scrollWidth</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的整体宽度。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.setAttribute()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 把指定属性设置或更改为指定值。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.setAttributeNode()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或更改指定属性节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.setIdAttribute()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;">  </td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.setIdAttributeNode()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;">  </td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.setUserData()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 把对象关联到元素上的键。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.style</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的 style 属性。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.tabIndex</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的 tab 键控制次序。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.tagName</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回元素的标签名。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.textContent</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回节点及其后代的文本内容。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.title</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回元素的 title 属性。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> element.toString()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 把元素转换为字符串。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> nodelist.item()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回 NodeList 中位于指定下标的节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> nodelist.length</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回 NodeList 中的节点数。</td> </tr> </tbody> </table> <br> <br> <br> <strong><span style="font-size:18px;color:#cc33cc;">四、Attr 对象</span></strong> <br> <span style="font-size:14px;">在 HTML DOM 中,Attr 对象表示 HTML 属性。</span> <span style="font-size:14px;">HTML 属性始终属于 HTML 元素。在 W3C DOM Core 中,Attr (attribute) 对象从 Node 对象继承所有属性和方法。</span> <span style="font-size:14px;">在 DOM 4 中,Attr 对象不再从 Node 继承。</span> <span style="font-size:14px;">为了保证未来的代码安全,您应该避免在属性对象上使用节点对象的属性和方法。</span> <br> <p><span style="font-family:'Microsoft YaHei';"><span style="font-size:14px;"></span></span> </p> <table class="dataintable" style="border:1px solid rgb(170,170,170);border-collapse:collapse;color:rgb(0,0,0);font-family:Verdana, Arial, '宋体';font-size:12px;"> <tbody style="border:0px;"> <tr style="border:0px;"> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;width:226px;"> 属性 / 方法</th> <th style="border:1px solid rgb(170,170,170);vertical-align:baseline;"> 描述</th> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> attr.isId</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 如果属性是 id 类型,则返回 true,否则返回 false。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> attr.name</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回属性的名称。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> attr.value</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置或返回属性的值。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> attr.specified</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 如果已指定属性,则返回 true,否则返回 false。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> nodemap.getNamedItem()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> <strong><span style="color:#ff0000;">从 NamedNodeMap 返回指定的属性节点。</span></strong></td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> nodemap.item()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回 NamedNodeMap 中位于指定下标的节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> nodemap.length</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 返回 NamedNodeMap 中的节点数。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> nodemap.removeNamedItem()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 移除指定的属性节点。</td> </tr> <tr style="border:0px;"> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> nodemap.setNamedItem()</td> <td style="border:1px solid rgb(170,170,170);vertical-align:text-top;"> 设置指定的属性节点(通过名称)。</td> </tr> </tbody> </table> <br> <p><span style="font-family:'Microsoft YaHei';"><strong><span style="font-size:18px;color:#cc33cc;">五、HTML DOM 常用方法</span></strong><br><span style="font-size:14px;">方法是我们可以在节点(HTML 元素)上执行的动作。</span><br><span style="font-size:14px;">一些 DOM 对象方法</span><br><span style="font-size:14px;">getElementById()</span><span style="font-size:14px;"></span><span style="font-size:14px;">返回带有指定 ID 的元素。</span><br><span style="font-size:14px;">getElementsByTagName()</span><span style="font-size:14px;"></span><span style="font-size:14px;">返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组)。</span><br><span style="font-size:14px;">getElementsByClassName()</span><span style="font-size:14px;"></span><span style="font-size:14px;">返回包含带有指定类名的所有元素的节点列表。</span><br><span style="font-size:14px;">appendChild()</span><span style="font-size:14px;"></span><span style="font-size:14px;">把新的子节点添加到指定节点。</span><br><span style="font-size:14px;">removeChild()</span><span style="font-size:14px;"></span><span style="font-size:14px;">删除子节点。</span><br><span style="font-size:14px;">replaceChild()</span><span style="font-size:14px;"></span><span style="font-size:14px;">替换子节点。</span><br><span style="font-size:14px;">insertBefore()</span><span style="font-size:14px;"></span><span style="font-size:14px;">在指定的子节点前面插入新的子节点。</span><br><span style="font-size:14px;">createAttribute()</span><span style="font-size:14px;"></span><span style="font-size:14px;">创建属性节点。</span><br><span style="font-size:14px;">createElement()</span><span style="font-size:14px;"></span><span style="font-size:14px;">创建元素节点。</span><br><span style="font-size:14px;">createTextNode()</span><span style="font-size:14px;"></span><span style="font-size:14px;">创建文本节点。</span><br><span style="font-size:14px;">getAttribute()</span><span style="font-size:14px;"></span><span style="font-size:14px;">返回指定的属性值。</span><br><span style="font-size:14px;">setAttribute()</span><span style="font-size:14px;"></span><span style="font-size:14px;">把指定属性设置或修改为指定的值。</span></span><br><br><span style="font-family:'Microsoft YaHei';font-size:14px;"><strong><span style="color:#cc33cc;">5.1 创建 HTML 内容</span></strong><br> 改变元素内容的最简答的方法是使用 innerHTML 属性。<br> 下面的例子改变一个 <p> 元素的 HTML 内容:</span><br></p> <pre><code class="language-javascript"><html> <body> <p id="p1">Hello World!</p> <script> document.getElementById("p1").innerHTML="New text!"; </script> </body> </html></code></pre> <span style="font-family:'Microsoft YaHei';font-size:14px;"><strong><span style="color:#cc33cc;">2.2 改变 HTML 样式</span></strong><br> 通过 HTML DOM,您能够访问 HTML 元素的样式对象。<br> 下面的例子改变一个段落的 HTML 样式:</span> <br> <pre><code class="language-javascript"><html> <body> <p id="p2">Hello world!</p> <script> document.getElementById("p2").style.color="blue"; </script> </body> </html> </code></pre> <span style="font-family:'Microsoft YaHei';font-size:14px;"><strong><span style="color:#cc33cc;">2.3 创建新的 HTML 元素</span></strong><br> 如需向 HTML DOM 添加新元素,您首先必须创建该元素(元素节点),然后把它追加到已有的元素上。</span> <br> <p></p> <p><span style="font-family:'Microsoft YaHei';font-size:14px;"></span></p> <pre><code class="language-javascript"><div id="d1"> <p id="p1">This is a paragraph.</p> <p id="p2">This is another paragraph.</p> </div> <script> var para=document.createElement("p"); var node=document.createTextNode("This is new."); para.appendChild(node); var element=document.getElementById("d1"); element.appendChild(para); </script> </code></pre> <p></p> <p><br></p> </div> </div> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1305696124669038592"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script> <!-- 文章页-底部 动态广告位 --> <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad"> <!-- 文章页-右侧1 动态广告位 --> <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div> <!-- 文章页-右侧2 动态广告位 --> <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div> <!-- 文章页-右侧3 动态广告位 --> <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(#,HTML/CSS/JS)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1892540600499105792.htm" title="uni.request 发起网络请求3种回调结果调用" target="_blank">uni.request 发起网络请求3种回调结果调用</a> <span class="text-muted">治金的blog</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a> <div>第一种标题:{{item.title}}内容:{{item.body}}import{ref}from'vue';letarrs=ref([]);//uni.request请求的三种方式functionrequest(){uni.request({url:"https://jsonplaceholder.typicode.com/posts",success:res=>{console.log(r</div> </li> <li><a href="/article/1892539841762095104.htm" title="js的垃圾回收机制" target="_blank">js的垃圾回收机制</a> <span class="text-muted">www.www</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/%E7%9B%B8%E5%85%B3/1.htm">相关</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>js中的垃圾回收机制JavaScript作为一种高级语言,开发者不需要手动管理内存的分配和释放。垃圾回收机制是JavaScript引擎中的一部分,负责自动回收那些不再被使用的内存,确保内存资源得到有效利用,避免内存泄漏。垃圾回收机制主要有两种算法:引用计数和标记清除引用计数基本原理:每个对象都有一个引用计数器,当有一个引用指向该对象时,计数器+1,当一个引用不再指向该对象时,计数器-1。如果某个对</div> </li> <li><a href="/article/1892538707169308672.htm" title="若依前后端分离集成CAS详细教程" target="_blank">若依前后端分离集成CAS详细教程</a> <span class="text-muted">Roc-xb</span> <a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%82%B9%E7%99%BB%E5%BD%95/1.htm">单点登录</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E5%90%8E%E7%AB%AF%E5%88%86%E7%A6%BB/1.htm">前后端分离</a><a class="tag" taget="_blank" href="/search/CAS/1.htm">CAS</a> <div>目录一、后端配置1、添加cas依赖2、修改配置文件3、修改LoginUser.java4、修改Constants.java5、添加CasProperties.java6、添加CasUserDetailsService.java7、添加CasAuthenticationSuccessHandler.java8、修改SecurityConfig9、启动后端二、前端配置1、修改settings.js2、</div> </li> <li><a href="/article/1892538578999767040.htm" title="基于Transformer的YOLOv8检测头架构改进:提升目标检测精度的全新突破(YOLOv8)" target="_blank">基于Transformer的YOLOv8检测头架构改进:提升目标检测精度的全新突破(YOLOv8)</a> <span class="text-muted">步入烟尘</span> <a class="tag" taget="_blank" href="/search/transformer/1.htm">transformer</a><a class="tag" taget="_blank" href="/search/YOLO/1.htm">YOLO</a><a class="tag" taget="_blank" href="/search/%E7%9B%AE%E6%A0%87%E6%A3%80%E6%B5%8B/1.htm">目标检测</a> <div>本专栏专为AI视觉领域的爱好者和从业者打造。涵盖分类、检测、分割、追踪等多项技术,带你从入门到精通!后续更有实战项目,助你轻松应对面试挑战!立即订阅,开启你的YOLOv8之旅!专栏订阅地址:https://blog.csdn.net/mrdeam/category_12804295.html文章目录基于Transformer的YOLOv8检测头架构改进:提升目标检测精度的全新突破什么是DAtten</div> </li> <li><a href="/article/1892536436008218624.htm" title="图片粘贴上传实现" target="_blank">图片粘贴上传实现</a> <span class="text-muted">SarinaDu</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a> <div>图片上传htmldemo直接粘贴本地运行查看效果即可,有看不懂的直接喂给deepseek会解释的很清晰粘贴图片上传示例-使用场景,粘贴桌面图片上传、粘贴word文档中图片上传、直接截图上传等body{font-family:Arial,sans-serif;padding:20px;}.upload-area{width:100%;height:200px;border:2pxdashed#ccc</div> </li> <li><a href="/article/1892536182668062720.htm" title="前后端分离跨域问题解决方案" target="_blank">前后端分离跨域问题解决方案</a> <span class="text-muted">慕容屠苏</span> <a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%89%8D%E7%AB%AF%E7%88%AC%E5%9D%91%E4%B9%8B%E8%B7%AF/1.htm">大前端爬坑之路</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E5%90%8E%E7%AB%AF%E5%88%86%E7%A6%BB/1.htm">前后端分离</a><a class="tag" taget="_blank" href="/search/%E8%B7%A8%E5%9F%9F%E9%97%AE%E9%A2%98%E8%A7%A3%E5%86%B3%E6%96%B9%E6%A1%88/1.htm">跨域问题解决方案</a> <div>前后端分离跨域问题解决方案现在的web开发中经常会用到前后分离技术,前后端分解技术,都会涉及到跨域问题。解决跨域问题的方法:第一种解决方案jsonp(不推荐使用)这种方案其实我是不赞同的,第一,在编码上jsonp会单独因为回调的关系,在传入传出还有定义回调函数上都会有编码的”不整洁”.简单阐述jsonp能够跨域是因为javascript的script标签,通过服务器返回script标签的code,</div> </li> <li><a href="/article/1892534920669097984.htm" title="Vue.js 从新手到专家:第七章 高级渲染、动态组件和插件合成" target="_blank">Vue.js 从新手到专家:第七章 高级渲染、动态组件和插件合成</a> <span class="text-muted">caifox菜狐狸</span> <a class="tag" taget="_blank" href="/search/Vue.js/1.htm">Vue.js</a><a class="tag" taget="_blank" href="/search/%E4%BB%8E%E6%96%B0%E6%89%8B%E5%88%B0%E4%B8%93%E5%AE%B6/1.htm">从新手到专家</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a><a class="tag" taget="_blank" href="/search/vite/1.htm">vite</a> <div>欢迎来到《Vue.js从新手到专家》的第七章!在这一章中,我们将深入探讨Vue.js的高级渲染技术、动态组件的使用以及如何通过插件扩展应用程序的功能。这些技能将帮助你构建更加灵活和可维护的应用程序。通过学习本章内容,你将掌握以下技能:理解Render函数和JSX的基本概念及其应用场景。学习函数式组件的定义及其实现方式。掌握如何为函数式组件定义Props和Emits。学习如何使用Vue插件全局地添加</div> </li> <li><a href="/article/1892533535663779840.htm" title="vue根据vue-admin-template封装导出excel数据文件组件" target="_blank">vue根据vue-admin-template封装导出excel数据文件组件</a> <span class="text-muted">Nikki_u</span> <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>(1)由于Export2Excel不仅依赖js-xlsx还依赖file-saver和script-loader。先需要安装如下命令npminstallxlsxfile-saver-Snpminstallscript-loader-S-D(2)导出表格地址https://github.com/PanJiaChen/vue-element-admin/blob/master/src/vendor/Ex</div> </li> <li><a href="/article/1892532653761032192.htm" title="CSS flex布局 列表单个元素点击 本行下插入详情独占一行" target="_blank">CSS flex布局 列表单个元素点击 本行下插入详情独占一行</a> <span class="text-muted">Cxiaomu</span> <a class="tag" taget="_blank" href="/search/CSS3/1.htm">CSS3</a><a class="tag" taget="_blank" href="/search/UI%E8%AE%BE%E8%AE%A1/1.htm">UI设计</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>技术栈:Vue2+javaScript简介在实际开发过程中有遇到一个场景:一个list,每行个数固定,点击单个元素后,在当前行与下一行之间插入一行元素详情,便于更直观的查看到对应的数据详情。这种情形,在移动端比较常见,比如用户列表,点击单个列表展示详情,可以考虑flex布局+positionrelative定位。实现思路对于需求重点和实现拆解列表元素:for遍历每行固定(3)个元素:flex布局、</div> </li> <li><a href="/article/1892530504545136640.htm" title="使用vue3框架vue-next-admin导出表格excel(带图片)" target="_blank">使用vue3框架vue-next-admin导出表格excel(带图片)</a> <span class="text-muted">乐多_L</span> <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>想要使用vue3导出表格内容并且图片显示在表格中(如图):步骤如下:下载安装插件:安装命令:npminstalljs-table2excel引入插件:importtable2excelfrom'js-table2excel'使用插件直接上代码:onBatchExport方法中数据的key值要与data中保持一致,否则数据无法获取到,打印出的结果就回为undefined。我写了两种导出:一种是全部导</div> </li> <li><a href="/article/1892529998733045760.htm" title="axios" target="_blank">axios</a> <span class="text-muted">是小傲雨呀^_^</span> <a class="tag" taget="_blank" href="/search/axios/1.htm">axios</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>1.简介:Axios是一个基于Promise的现代化HTTP客户端库,广泛用于浏览器和Node.js环境中发送HTTP请求。它的设计目标是简化前后端数据交互,提供更高效、更易用的API。2.Axios的核心作用发送HTTP请求支持所有常见请求方法(GET、POST、PUT、DELETE等),并自动处理请求参数和响应数据。拦截请求和响应可以在请求发送前或响应返回后添加统一的处理逻辑(例如添加认证To</div> </li> <li><a href="/article/1892529367511265280.htm" title="uniapp 右侧刷新图标 和 返回顶部图标的实现" target="_blank">uniapp 右侧刷新图标 和 返回顶部图标的实现</a> <span class="text-muted">治金的blog</span> <a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>{{item.content}}----{{item.author}}图标-->import{ref}from'vue';//触底加载更多,下拉刷新API(下拉刷新需要在pages.json里面开启这项功能)import{onReachBottom,onPullDownRefresh}from"@dcloudio/uni-app"constpets=ref([]);//触底加载更多,实现连接,使用</div> </li> <li><a href="/article/1892528359695511552.htm" title="详细介绍:封装简易的 Axios 函数获取省份列表" target="_blank">详细介绍:封装简易的 Axios 函数获取省份列表</a> <span class="text-muted">还是鼠鼠</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/vscode/1.htm">vscode</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a> <div>目录关键步骤:完整代码(html):代码解析:程序运行结果:本示例展示了如何通过封装一个简易的myAxios函数来模拟axios的功能,使用原生的XMLHttpRequest(XHR)对象来发起HTTP请求。我们将实现一个简单的功能,通过该封装函数从服务器获取省份列表数据,并在网页上显示这些省份。关键步骤:封装myAxios函数:myAxios函数接收一个配置对象(如请求的URL和方法),并返回一</div> </li> <li><a href="/article/1892526214493564928.htm" title="国内那么多的低代码平台,究竟哪家比较强?" target="_blank">国内那么多的低代码平台,究竟哪家比较强?</a> <span class="text-muted">有颜有货</span> <a class="tag" taget="_blank" href="/search/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%B9%B3%E5%8F%B0/1.htm">低代码平台</a><a class="tag" taget="_blank" href="/search/%E4%BD%8E%E4%BB%A3%E7%A0%81/1.htm">低代码</a><a class="tag" taget="_blank" href="/search/%E4%BD%8E%E4%BB%A3%E7%A0%81/1.htm">低代码</a><a class="tag" taget="_blank" href="/search/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%B9%B3%E5%8F%B0/1.htm">低代码平台</a> <div>国内低代码平台哪家强?本人摸索低代码5年多,体验过几十家低代码平台,下面通过2张功能对比图,3K字内容详细告诉你:国内低代码到底哪家强。如果你觉得我的分析对你有一定帮助,还请点赞收藏支持一下,争取能让更多人看到并帮助需要的人。话不多说,先上图。国内主流低代码产品功能对比。(图二在回答末尾)一、织信Informat(企业级低代码平台)功能清单驱动方式:模型驱动字段支持:35种字段,同时支持通过js脚</div> </li> <li><a href="/article/1892507680455585792.htm" title="Android arcgis加载在线底图" target="_blank">Android arcgis加载在线底图</a> <span class="text-muted">Angie洛林</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/arcgis/1.htm">arcgis</a> <div>我整理的一些关于【信息系统】的项目学习资料(附讲解~~)和大家一起分享、学习一下:https://edu.51cto.com/mic-position/757.html在Android中使用ArcGIS加载在线底图ArcGIS是Esri提供的一套强大的地理信息系统(GIS)解决方案,支持多种平台,包括Android。本文将介绍如何在Android应用中使用ArcGIS加载在线底图,并配有相关代码示</div> </li> <li><a href="/article/1892506293600579584.htm" title="cesium(vue)一些面试问题(包含Three.js)" target="_blank">cesium(vue)一些面试问题(包含Three.js)</a> <span class="text-muted">GIS瞧葩菜</span> <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/cesium/1.htm">cesium</a> <div>1.在不同的应用场景和技术栈中,模型加载方法和格式有所不同,下面主要从Web前端三维场景(使用Three.js和cesium)使用Three.js加载模型常见模型格式及加载方法GLTF/GLB格式格式特点:GLTF(GraphicsLibraryTransmissionFormat)是一种开放的、基于JSON的三维模型传输格式,GLB是其二进制版本。它们具有文件小、加载快、支持动画、材质和骨骼等优</div> </li> <li><a href="/article/1892502492609048576.htm" title="CSS中五种定位方式(position)对比分析" target="_blank">CSS中五种定位方式(position)对比分析</a> <span class="text-muted">七公子77</span> <a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>在CSS中,定位方式(position)决定了元素如何相对于其参照物进行定位,同时影响文档流的布局。以下是五种定位方式的对比、参照物说明及代码示例:1.position:static(默认定位)参照物:无,元素位于默认文档流中。文档流:元素按照HTML顺序自然排列。特点:top、right、bottom、left和z-index属性无效。示例:Box1Box2.box{width:100px;he</div> </li> <li><a href="/article/1892500097330114560.htm" title="简易java调用DeepSeek Api教程" target="_blank">简易java调用DeepSeek Api教程</a> <span class="text-muted">m0_62519278</span> <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E5%B0%8F%E6%9C%AC%E6%9C%AC/1.htm">学习小本本</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>一、请求格式首先观察官方文档给出的访问api的样例脚本curlhttps://api.deepseek.com/chat/completions\-H"Content-Type:application/json"\-H"Authorization:Bearer"\-d'{"model":"deepseek-chat","messages":[{"role":"system","content":"</div> </li> <li><a href="/article/1892482448659378176.htm" title="【vue】Mammoth.js的使用:将.docx转换成HTML" target="_blank">【vue】Mammoth.js的使用:将.docx转换成HTML</a> <span class="text-muted">暴富暴富暴富啦啦啦</span> <a class="tag" taget="_blank" href="/search/1024%E7%A8%8B%E5%BA%8F%E5%91%98%E8%8A%82/1.htm">1024程序员节</a> <div>mammoth.convertToHtml(input,options):把源文档转换为HTML文档mammoth.convertToMarkdown(input,options):把源文档转换为Markdown文档。mammoth.extractRawText(input):提取文档的原始文本。这将忽略文档中的所有格式。每个段落后跟两个换行符。npminstallelement-uimammot</div> </li> <li><a href="/article/1892478409288773632.htm" title="OpenLayers总结3" target="_blank">OpenLayers总结3</a> <span class="text-muted">Super毛毛穗</span> <a class="tag" taget="_blank" href="/search/WebGIS%E5%BC%80%E5%8F%91/1.htm">WebGIS开发</a><a class="tag" taget="_blank" href="/search/OpenLayers/1.htm">OpenLayers</a><a class="tag" taget="_blank" href="/search/GIS/1.htm">GIS</a><a class="tag" taget="_blank" href="/search/WebGIS/1.htm">WebGIS</a> <div>一、静态测距1.原理静态测距主要是针对地图上已有的矢量要素(如线要素),利用OpenLayers提供的几何计算函数来获取其长度。在实际操作中,先加载包含几何要素的GeoJSON数据到矢量图层,当鼠标指针移动到要素上时,获取该要素的几何信息,再调用getLength函数计算其长度。2.代码实现步骤及注释//引入必要的模块importVectorLayerfrom"ol/layer/Vector.js</div> </li> <li><a href="/article/1892477779023294464.htm" title="vue3-video-play 插件在 Vue 3 项目上的应用" target="_blank">vue3-video-play 插件在 Vue 3 项目上的应用</a> <span class="text-muted">放逐者-保持本心,方可放逐</span> <a class="tag" taget="_blank" href="/search/vue3%E5%BA%94%E7%94%A8/1.htm">vue3应用</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/vue3-video-play/1.htm">vue3-video-play</a> <div>文章目录vue3-video-play插件在Vue3项目上的应用一、插件简介二、插件安装三、插件组件应用示例1.局部引入组件2.全局引入组件四、需要注意的事项五、本地环境将`package.json`中`"module":"./dist/index.es.js"`改为`"module":"./dist/index.mjs"`问题解析探索问题描述原因分析解决方案格式及应用实例vue3-video-p</div> </li> <li><a href="/article/1892474879861649408.htm" title="探索 TypeScript Redux:构建大规模JavaScript应用的终极指南" target="_blank">探索 TypeScript Redux:构建大规模JavaScript应用的终极指南</a> <span class="text-muted">柳旖岭</span> <div>探索TypeScriptRedux:构建大规模JavaScript应用的终极指南去发现同类优质开源项目:https://gitcode.com/在当今快速发展的前端开发领域中,组合正确工具集来应对复杂性和扩展性挑战至关重要。今天,我们将深入了解一个令人兴奋的开源项目——TypeScriptRedux,它结合了TypeScript、JSPM、typings、React和Redux的强大功能,为开发者</div> </li> <li><a href="/article/1892473871148314624.htm" title="单细胞轨迹分析-monocle包的使用" target="_blank">单细胞轨迹分析-monocle包的使用</a> <span class="text-muted">探序基因</span> <a class="tag" taget="_blank" href="/search/r%E8%AF%AD%E8%A8%80/1.htm">r语言</a> <div>探序基因肿瘤研究院整理安装:monocle源码下载:https://www.bioconductor.org/packages/release/bioc/html/monocle.htmlR版本,4.2.0BiocManager::install("monocle")不过在安装过程中还是报错了:Warning:无法在https://bioconductor.org/packages/3.15/bi</div> </li> <li><a href="/article/1892471976795107328.htm" title="前端导出word文件—包含canvas(echarts图表)" target="_blank">前端导出word文件—包含canvas(echarts图表)</a> <span class="text-muted">Liuer_Qin</span> <a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/canvas/1.htm">canvas</a><a class="tag" taget="_blank" href="/search/echarts/1.htm">echarts</a><a class="tag" taget="_blank" href="/search/echarts/1.htm">echarts</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>一、使用的插件html-docx-js二、整体思路因为canvas是运行在内存中的,所以不能简单的通过dom获取canvas图片,需要手动的先将canvas转为image。三、实现先克隆要下载的DOM的副本。因为canvas是运行在内存中的,所以也不能通过cloneNode方法克隆下来(克隆下来是空的)。我们这里将原DOM中的canvas转成图片,然后插入到副本的对应位置,这样操作不会影响原DOM</div> </li> <li><a href="/article/1892470464907898880.htm" title="语聊房软件开发流程与基础功能" target="_blank">语聊房软件开发流程与基础功能</a> <span class="text-muted">ALLSectorSorft</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>开发一款语聊房软件需要系统的规划和多领域技术整合。以下是关键流程、基础功能及示例代码:---一、开发流程1.需求分析-明确目标用户(社交/游戏/教育)-竞品分析(Clubhouse/Discord/狼人杀)-核心功能优先级排序2.技术选型-实时语音:声网Agora(推荐)/腾讯云TRTC/WebRTC-即时通讯:Socket.io/Sendbird/Firebase-后端框架:Node.js/Sp</div> </li> <li><a href="/article/1892468952072777728.htm" title="Vue.js 基础与实战指南:从入门到跑路" target="_blank">Vue.js 基础与实战指南:从入门到跑路</a> <span class="text-muted">王嘉俊705</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/visual/1.htm">visual</a><a class="tag" taget="_blank" href="/search/studio/1.htm">studio</a><a class="tag" taget="_blank" href="/search/code/1.htm">code</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a> <div>一、Vue的两种使用方式扩展核心包开发直接通过引入Vue.js,适用于简单页面或局部功能增强。优点:轻量,无需构建工具。缺点:难以管理复杂项目,缺少工程化支持。工程化开发使用VueCLI、Vite等工具创建项目,结合Webpack/Vite构建。支持单文件组件(.vue文件),结构清晰(`,,)。插件生态丰富(如VueRouter、Vuex、Pinia)。二、Vue实例的深入理解核心配置项 new</div> </li> <li><a href="/article/1892463401469276160.htm" title="揭秘 CSS Houdini:用浏览器魔法解锁 CSS 的终极潜力" target="_blank">揭秘 CSS Houdini:用浏览器魔法解锁 CSS 的终极潜力</a> <span class="text-muted">寒鸦xxx</span> <a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/houdini/1.htm">houdini</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>一、为什么我们需要CSSHoudini?1.1传统CSS的困境当我们试图用CSS实现一个波浪形边框时,通常会经历这样的挣扎:/*传统实现方案*/.wave-border{position:relative;overflow:hidden;}.wave-border::after{content:'';position:absolute;/*需要复杂计算和多个伪元素拼接*/}这种实现方式存在三个致命</div> </li> <li><a href="/article/1892457086076383232.htm" title="动态蛇形卷积(DySnakeConv)在YOLOv8检测头中的应用与优化-分割性能的提升【YOLOv8】" target="_blank">动态蛇形卷积(DySnakeConv)在YOLOv8检测头中的应用与优化-分割性能的提升【YOLOv8】</a> <span class="text-muted">步入烟尘</span> <a class="tag" taget="_blank" href="/search/YOLO/1.htm">YOLO</a><a class="tag" taget="_blank" href="/search/%E5%8A%A8%E6%80%81%E8%9B%87%E5%BD%A2%E5%8D%B7%E7%A7%AF/1.htm">动态蛇形卷积</a><a class="tag" taget="_blank" href="/search/DySnakeConv/1.htm">DySnakeConv</a> <div>本专栏专为AI视觉领域的爱好者和从业者打造。涵盖分类、检测、分割、追踪等多项技术,带你从入门到精通!后续更有实战项目,助你轻松应对面试挑战!立即订阅,开启你的YOLOv8之旅!专栏订阅地址:https://blog.csdn.net/mrdeam/category_12804295.html文章目录动态蛇形卷积(DySnakeConv)在YOLOv8检测头中的应用与优化-分割性能的提升【YOLOv</div> </li> <li><a href="/article/1892453179853959168.htm" title="微信支付-扫码支付全流程" target="_blank">微信支付-扫码支付全流程</a> <span class="text-muted">自娱自乐22</span> <a class="tag" taget="_blank" href="/search/thinkphp/1.htm">thinkphp</a><a class="tag" taget="_blank" href="/search/php/1.htm">php</a><a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E6%89%AB%E7%A0%81%E6%94%AF%E4%BB%98/1.htm">微信扫码支付</a> <div>微信支付官方文档:`https://pay.weixin.qq.com/wiki/doc/api/index.html`微信支付分为2种模式:【模式一】:商户后台系统根据微信支付规则链接生成二维码,链接中带固定参数productid(可定义为产品标识或订单号)。用户扫码后,微信支付系统将productid和用户唯一标识(openid)回调商户后台系统(需要设置支付回调URL),商户后台系统根据pr</div> </li> <li><a href="/article/1892453053508939776.htm" title="mac+php5.3的docker-compose.yml分享" target="_blank">mac+php5.3的docker-compose.yml分享</a> <span class="text-muted">自娱自乐22</span> <a class="tag" taget="_blank" href="/search/docker/1.htm">docker</a> <div>version:'3'services:nginx:image:nginx:latestcontainer_name:nginx-composevolumes:-./wwwroot:/usr/share/nginx/html:rw-./nginx/nginx/:/etc/nginx/:rw-./log/nginx:/var/log/nginx:rwrestart:alwayslinks:-phpp</div> </li> <li><a href="/article/57.htm" title="多线程编程之join()方法" target="_blank">多线程编程之join()方法</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/JOIN/1.htm">JOIN</a><a class="tag" taget="_blank" href="/search/%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">多线程</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B/1.htm">编程</a><a class="tag" taget="_blank" href="/search/%E7%BA%BF%E7%A8%8B/1.htm">线程</a> <div>现实生活中,有些工作是需要团队中成员依次完成的,这就涉及到了一个顺序问题。现在有T1、T2、T3三个工人,如何保证T2在T1执行完后执行,T3在T2执行完后执行?问题分析:首先问题中有三个实体,T1、T2、T3, 因为是多线程编程,所以都要设计成线程类。关键是怎么保证线程能依次执行完呢?   Java实现过程如下: public class T1 implements Runnabl</div> </li> <li><a href="/article/184.htm" title="java中switch的使用" target="_blank">java中switch的使用</a> <span class="text-muted">bingyingao</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/enum/1.htm">enum</a><a class="tag" taget="_blank" href="/search/break/1.htm">break</a><a class="tag" taget="_blank" href="/search/continue/1.htm">continue</a> <div>java中的switch仅支持case条件仅支持int、enum两种类型。 用enum的时候,不能直接写下列形式。 switch (timeType) { case ProdtransTimeTypeEnum.DAILY: break; default: br</div> </li> <li><a href="/article/311.htm" title="hive having count 不能去重" target="_blank">hive having count 不能去重</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/hive/1.htm">hive</a><a class="tag" taget="_blank" href="/search/%E5%8E%BB%E9%87%8D/1.htm">去重</a><a class="tag" taget="_blank" href="/search/having+count/1.htm">having count</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E6%95%B0/1.htm">计数</a> <div>hive在使用having count()是,不支持去重计数   hive (default)> select imei from t_test_phonenum where ds=20150701 group by imei having count(distinct phone_num)>1 limit 10;  FAILED: SemanticExcep</div> </li> <li><a href="/article/438.htm" title="WebSphere对JSP的缓存" target="_blank">WebSphere对JSP的缓存</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/WAS+JSP+%E7%BC%93%E5%AD%98/1.htm">WAS JSP 缓存</a> <div>      对于线网上的工程,更新JSP到WebSphere后,有时会出现修改的jsp没有起作用,特别是改变了某jsp的样式后,在页面中没看到效果,这主要就是由于websphere中缓存的缘故,这就要清除WebSphere中jsp缓存。要清除WebSphere中JSP的缓存,就要找到WAS安装后的根目录。        现服务</div> </li> <li><a href="/article/565.htm" title="设计模式总结" target="_blank">设计模式总结</a> <span class="text-muted">朱辉辉33</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a> <div>1.工厂模式   1.1 工厂方法模式 (由一个工厂类管理构造方法)      1.1.1普通工厂模式(一个工厂类中只有一个方法)      1.1.2多工厂模式(一个工厂类中有多个方法)      1.1.3静态工厂模式(将工厂类中的方法变成静态方法) &n</div> </li> <li><a href="/article/692.htm" title="实例:供应商管理报表需求调研报告" target="_blank">实例:供应商管理报表需求调研报告</a> <span class="text-muted">老A不折腾</span> <a class="tag" taget="_blank" href="/search/finereport/1.htm">finereport</a><a class="tag" taget="_blank" href="/search/%E6%8A%A5%E8%A1%A8%E7%B3%BB%E7%BB%9F/1.htm">报表系统</a><a class="tag" taget="_blank" href="/search/%E6%8A%A5%E8%A1%A8%E8%BD%AF%E4%BB%B6/1.htm">报表软件</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%8C%96%E9%80%89%E5%9E%8B/1.htm">信息化选型</a> <div>引言 随着企业集团的生产规模扩张,为支撑全球供应链管理,对于供应商的管理和采购过程的监控已经不局限于简单的交付以及价格的管理,目前采购及供应商管理各个环节的操作分别在不同的系统下进行,而各个数据源都独立存在,无法提供统一的数据支持;因此,为了实现对于数据分析以提供采购决策,建立报表体系成为必须。 业务目标 1、通过报表为采购决策提供数据分析与支撑 2、对供应商进行综合评估以及管理,合理管理和</div> </li> <li><a href="/article/819.htm" title="mysql" target="_blank">mysql</a> <span class="text-muted">林鹤霄</span> <div>转载源:http://blog.sina.com.cn/s/blog_4f925fc30100rx5l.html mysql -uroot -p ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES)   [root@centos var]# service mysql</div> </li> <li><a href="/article/946.htm" title="Linux下多线程堆栈查看工具(pstree、ps、pstack)" target="_blank">Linux下多线程堆栈查看工具(pstree、ps、pstack)</a> <span class="text-muted">aigo</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>原文:http://blog.csdn.net/yfkiss/article/details/6729364   1. pstree pstree以树结构显示进程$ pstree -p work | grep adsshd(22669)---bash(22670)---ad_preprocess(4551)-+-{ad_preprocess}(4552)  &n</div> </li> <li><a href="/article/1073.htm" title="html input与textarea 值改变事件" target="_blank">html input与textarea 值改变事件</a> <span class="text-muted">alxw4616</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a> <div>// 文本输入框(input) 文本域(textarea)值改变事件 // onpropertychange(IE) oninput(w3c) $('input,textarea').on('propertychange input', function(event) {      console.log($(this).val()) });   </div> </li> <li><a href="/article/1200.htm" title="String类的基本用法" target="_blank">String类的基本用法</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/String/1.htm">String</a> <div>  字符串的用法;     // 根据字节数组创建字符串 byte[] by = { 'a', 'b', 'c', 'd' }; String newByteString = new String(by);         1,length()  获取字符串的长度     &nbs</div> </li> <li><a href="/article/1327.htm" title="JDK1.5 Semaphore实例" target="_blank">JDK1.5 Semaphore实例</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/thread/1.htm">thread</a><a class="tag" taget="_blank" href="/search/java%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">java多线程</a><a class="tag" taget="_blank" href="/search/Semaphore/1.htm">Semaphore</a> <div>Semaphore类        一个计数信号量。从概念上讲,信号量维护了一个许可集合。如有必要,在许可可用前会阻塞每一个 acquire(),然后再获取该许可。每个 release() 添加一个许可,从而可能释放一个正在阻塞的获取者。但是,不使用实际的许可对象,Semaphore 只对可用许可的号码进行计数,并采取相应的行动。 S</div> </li> <li><a href="/article/1454.htm" title="使用GZip来压缩传输量" target="_blank">使用GZip来压缩传输量</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/GZip/1.htm">GZip</a> <div>        启动GZip压缩要用到一个开源的Filter:PJL Compressing Filter。这个Filter自1.5.0开始该工程开始构建于JDK5.0,因此在JDK1.4环境下只能使用1.4.6。         PJL Compressi</div> </li> <li><a href="/article/1581.htm" title="【Java范型三】Java范型详解之范型类型通配符" target="_blank">【Java范型三】Java范型详解之范型类型通配符</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>    定义如下一个简单的范型类,   package com.tom.lang.generics; public class Generics<T> { private T value; public Generics(T value) { this.value = value; } } </div> </li> <li><a href="/article/1708.htm" title="【Hadoop十二】HDFS常用命令" target="_blank">【Hadoop十二】HDFS常用命令</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a> <div>1. 修改日志文件查看器   hdfs oev -i edits_0000000000000000081-0000000000000000089 -o edits.xml cat edits.xml   修改日志文件转储为xml格式的edits.xml文件,其中每条RECORD就是一个操作事务日志   2. fsimage查看HDFS中的块信息等 &nb</div> </li> <li><a href="/article/1835.htm" title="怎样区别nginx中rewrite时break和last" target="_blank">怎样区别nginx中rewrite时break和last</a> <span class="text-muted">ronin47</span> <div>在使用nginx配置rewrite中经常会遇到有的地方用last并不能工作,换成break就可以,其中的原理是对于根目录的理解有所区别,按我的测试结果大致是这样的。 location /    {         proxy_pass http://test; </div> </li> <li><a href="/article/1962.htm" title="java-21.中兴面试题 输入两个整数 n 和 m ,从数列 1 , 2 , 3.......n 中随意取几个数 , 使其和等于 m" target="_blank">java-21.中兴面试题 输入两个整数 n 和 m ,从数列 1 , 2 , 3.......n 中随意取几个数 , 使其和等于 m</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> import java.util.ArrayList; import java.util.List; import java.util.Stack; public class CombinationToSum { /* 第21 题 2010 年中兴面试题 编程求解: 输入两个整数 n 和 m ,从数列 1 , 2 , 3.......n 中随意取几个数 , 使其和等</div> </li> <li><a href="/article/2089.htm" title="eclipse svn 帐号密码修改问题" target="_blank">eclipse svn 帐号密码修改问题</a> <span class="text-muted">开窍的石头</span> <a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a><a class="tag" taget="_blank" href="/search/SVN/1.htm">SVN</a><a class="tag" taget="_blank" href="/search/svn%E5%B8%90%E5%8F%B7%E5%AF%86%E7%A0%81%E4%BF%AE%E6%94%B9/1.htm">svn帐号密码修改</a> <div>问题描述:      Eclipse的SVN插件Subclipse做得很好,在svn操作方面提供了很强大丰富的功能。但到目前为止,该插件对svn用户的概念极为淡薄,不但不能方便地切换用户,而且一旦用户的帐号、密码保存之后,就无法再变更了。 解决思路:      删除subclipse记录的帐号、密码信息,重新输入</div> </li> <li><a href="/article/2216.htm" title="[电子商务]传统商务活动与互联网的结合" target="_blank">[电子商务]传统商务活动与互联网的结合</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E7%94%B5%E5%AD%90%E5%95%86%E5%8A%A1/1.htm">电子商务</a> <div>       某一个传统名牌产品,过去销售的地点就在某些特定的地区和阶层,现在进入互联网之后,用户的数量群突然扩大了无数倍,但是,这种产品潜在的劣势也被放大了无数倍,这种销售利润与经营风险同步放大的效应,在最近几年将会频繁出现。。。。        如何避免销售量和利润率增加的</div> </li> <li><a href="/article/2343.htm" title="java 解析 properties-使用 Properties-可以指定配置文件路径" target="_blank">java 解析 properties-使用 Properties-可以指定配置文件路径</a> <span class="text-muted">cuityang</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/properties/1.htm">properties</a> <div>#mq xdr.mq.url=tcp://192.168.100.15:61618; import java.io.IOException; import java.util.Properties; public class Test { String conf = "log4j.properties"; private static final</div> </li> <li><a href="/article/2470.htm" title="Java核心问题集锦" target="_blank">Java核心问题集锦</a> <span class="text-muted">darrenzhu</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%9F%BA%E7%A1%80/1.htm">基础</a><a class="tag" taget="_blank" href="/search/%E6%A0%B8%E5%BF%83/1.htm">核心</a><a class="tag" taget="_blank" href="/search/%E9%9A%BE%E7%82%B9/1.htm">难点</a> <div>注意,这里的参考文章基本来自Effective Java和jdk源码 1)ConcurrentModificationException 当你用for each遍历一个list时,如果你在循环主体代码中修改list中的元素,将会得到这个Exception,解决的办法是: 1)用listIterator, 它支持在遍历的过程中修改元素, 2)不用listIterator, new一个</div> </li> <li><a href="/article/2724.htm" title="1分钟学会Markdown语法" target="_blank">1分钟学会Markdown语法</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/markdown/1.htm">markdown</a> <div>markdown 简明语法 基本符号 *,-,+ 3个符号效果都一样,这3个符号被称为 Markdown符号 空白行表示另起一个段落 `是表示inline代码,tab是用来标记 代码段,分别对应html的code,pre标签 换行 单一段落( <p>) 用一个空白行 连续两个空格 会变成一个 <br> 连续3个符号,然后是空行</div> </li> <li><a href="/article/2851.htm" title="Gson使用二(GsonBuilder)" target="_blank">Gson使用二(GsonBuilder)</a> <span class="text-muted">eksliang</span> <a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/gson/1.htm">gson</a><a class="tag" taget="_blank" href="/search/GsonBuilder/1.htm">GsonBuilder</a> <div>转载请出自出处:http://eksliang.iteye.com/blog/2175473 一.概述     GsonBuilder用来定制java跟json之间的转换格式   二.基本使用 实体测试类: 温馨提示:默认情况下@Expose注解是不起作用的,除非你用GsonBuilder创建Gson的时候调用了GsonBuilder.excludeField</div> </li> <li><a href="/article/2978.htm" title="报ClassNotFoundException: Didn't find class "...Activity" on path: DexPathList" target="_blank">报ClassNotFoundException: Didn't find class "...Activity" on path: DexPathList</a> <span class="text-muted">gundumw100</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>有一个工程,本来运行是正常的,我想把它移植到另一台PC上,结果报: java.lang.RuntimeException: Unable to instantiate activity ComponentInfo{com.mobovip.bgr/com.mobovip.bgr.MainActivity}: java.lang.ClassNotFoundException: Didn't f</div> </li> <li><a href="/article/3105.htm" title="JavaWeb之JSP指令" target="_blank">JavaWeb之JSP指令</a> <span class="text-muted">ihuning</span> <a class="tag" taget="_blank" href="/search/javaweb/1.htm">javaweb</a> <div>  要点   JSP指令简介  page指令  include指令    JSP指令简介    JSP指令(directive)是为JSP引擎而设计的,它们并不直接产生任何可见输出,而只是告诉引擎如何处理JSP页面中的其余部分。 JSP指令的基本语法格式: <%@ 指令 属性名="</div> </li> <li><a href="/article/3232.htm" title="mac上编译FFmpeg跑ios" target="_blank">mac上编译FFmpeg跑ios</a> <span class="text-muted">啸笑天</span> <a class="tag" taget="_blank" href="/search/ffmpeg/1.htm">ffmpeg</a> <div>1、下载文件:https://github.com/libav/gas-preprocessor, 复制gas-preprocessor.pl到/usr/local/bin/下, 修改文件权限:chmod 777 /usr/local/bin/gas-preprocessor.pl 2、安装yasm-1.2.0 curl http://www.tortall.net/projects/yasm</div> </li> <li><a href="/article/3359.htm" title="sql mysql oracle中字符串连接" target="_blank">sql mysql oracle中字符串连接</a> <span class="text-muted">macroli</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/SQL+Server/1.htm">SQL Server</a> <div>有的时候,我们有需要将由不同栏位获得的资料串连在一起。每一种资料库都有提供方法来达到这个目的: MySQL: CONCAT() Oracle: CONCAT(), || SQL Server: + CONCAT() 的语法如下: Mysql 中 CONCAT(字串1, 字串2, 字串3, ...): 将字串1、字串2、字串3,等字串连在一起。 请注意,Oracle的CON</div> </li> <li><a href="/article/3486.htm" title="Git fatal: unab SSL certificate problem: unable to get local issuer ce rtificate" target="_blank">Git fatal: unab SSL certificate problem: unable to get local issuer ce rtificate</a> <span class="text-muted">qiaolevip</span> <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E6%B0%B8%E6%97%A0%E6%AD%A2%E5%A2%83/1.htm">学习永无止境</a><a class="tag" taget="_blank" href="/search/%E6%AF%8F%E5%A4%A9%E8%BF%9B%E6%AD%A5%E4%B8%80%E7%82%B9%E7%82%B9/1.htm">每天进步一点点</a><a class="tag" taget="_blank" href="/search/git/1.htm">git</a><a class="tag" taget="_blank" href="/search/%E7%BA%B5%E8%A7%82%E5%8D%83%E8%B1%A1/1.htm">纵观千象</a> <div>// 报错如下: $ git pull origin master fatal: unable to access 'https://git.xxx.com/': SSL certificate problem: unable to get local issuer ce rtificate   // 原因: 由于git最新版默认使用ssl安全验证,但是我们是使用的git未设</div> </li> <li><a href="/article/3613.htm" title="windows命令行设置wifi" target="_blank">windows命令行设置wifi</a> <span class="text-muted">surfingll</span> <a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a><a class="tag" taget="_blank" href="/search/wifi/1.htm">wifi</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0%E6%9C%ACwifi/1.htm">笔记本wifi</a> <div>还没有讨厌无线wifi的无尽广告么,还在耐心等待它慢慢启动么 教你命令行设置 笔记本电脑wifi: 1、开启wifi命令 netsh wlan set hostednetwork mode=allow ssid=surf8 key=bb123456 netsh wlan start hostednetwork pause 其中pause是等待输入,可以去掉 2、</div> </li> <li><a href="/article/3740.htm" title="Linux(Ubuntu)下安装sysv-rc-conf" target="_blank">Linux(Ubuntu)下安装sysv-rc-conf</a> <span class="text-muted">wmlJava</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/ubuntu/1.htm">ubuntu</a><a class="tag" taget="_blank" href="/search/sysv-rc-conf/1.htm">sysv-rc-conf</a> <div>安装:sudo apt-get install sysv-rc-conf 使用:sudo sysv-rc-conf 操作界面十分简洁,你可以用鼠标点击,也可以用键盘方向键定位,用空格键选择,用Ctrl+N翻下一页,用Ctrl+P翻上一页,用Q退出。     背景知识 sysv-rc-conf是一个强大的服务管理程序,群众的意见是sysv-rc-conf比chkconf</div> </li> <li><a href="/article/3867.htm" title="svn切换环境,重发布应用多了javaee标签前缀" target="_blank">svn切换环境,重发布应用多了javaee标签前缀</a> <span class="text-muted">zengshaotao</span> <a class="tag" taget="_blank" href="/search/javaee/1.htm">javaee</a> <div>更换了开发环境,从杭州,改变到了上海。svn的地址肯定要切换的,切换之前需要将原svn自带的.svn文件信息删除,可手动删除,也可通过废弃原来的svn位置提示删除.svn时删除。   然后就是按照最新的svn地址和规范建立相关的目录信息,再将原来的纯代码信息上传到新的环境。然后再重新检出,这样每次修改后就可以看到哪些文件被修改过,这对于增量发布的规范特别有用。   检出</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类:</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved. <!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>--> </div> </div> </footer> <!-- 代码高亮 --> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>