From 2f85cc30024c4767220da9e0ca6312154809019a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8D=A2=E8=BF=87=E5=BB=BA?= <168718453@qq.com> Date: Tue, 22 Nov 2022 21:44:18 +0800 Subject: [PATCH] =?UTF-8?q?02=E5=8D=A2=E5=9B=BD=E5=BB=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...\345\216\206\347\273\203\344\271\240.html" | 53 ++++++++ ...73\345\212\240\345\261\236\346\200\247.md" | 123 ++++++++++++++++++ 2 files changed, 176 insertions(+) create mode 100644 "02\345\215\242\345\233\275\345\273\272/\344\275\234\344\270\232/2022_11_21_\345\267\245\344\275\234\347\273\217\345\216\206\347\273\203\344\271\240.html" create mode 100644 "02\345\215\242\345\233\275\345\273\272/\347\254\224\350\256\260/11.21\350\216\267\345\217\226\344\270\213\346\213\211\346\241\206&\350\241\250\345\215\225&\346\267\273\345\212\240\345\261\236\346\200\247.md" diff --git "a/02\345\215\242\345\233\275\345\273\272/\344\275\234\344\270\232/2022_11_21_\345\267\245\344\275\234\347\273\217\345\216\206\347\273\203\344\271\240.html" "b/02\345\215\242\345\233\275\345\273\272/\344\275\234\344\270\232/2022_11_21_\345\267\245\344\275\234\347\273\217\345\216\206\347\273\203\344\271\240.html" new file mode 100644 index 0000000..0623f1e --- /dev/null +++ "b/02\345\215\242\345\233\275\345\273\272/\344\275\234\344\270\232/2022_11_21_\345\267\245\344\275\234\347\273\217\345\216\206\347\273\203\344\271\240.html" @@ -0,0 +1,53 @@ + + + + + 动态添加和删除节点 + + + + +

工作经历

+
+
+
+ 公司名称: + 职位: + 删除工作经历 +
+ 工作职责及工作内容描述: + +
+
+
+ +
+ 添加工作经历 +
+ + + \ No newline at end of file diff --git "a/02\345\215\242\345\233\275\345\273\272/\347\254\224\350\256\260/11.21\350\216\267\345\217\226\344\270\213\346\213\211\346\241\206&\350\241\250\345\215\225&\346\267\273\345\212\240\345\261\236\346\200\247.md" "b/02\345\215\242\345\233\275\345\273\272/\347\254\224\350\256\260/11.21\350\216\267\345\217\226\344\270\213\346\213\211\346\241\206&\350\241\250\345\215\225&\346\267\273\345\212\240\345\261\236\346\200\247.md" new file mode 100644 index 0000000..697028b --- /dev/null +++ "b/02\345\215\242\345\233\275\345\273\272/\347\254\224\350\256\260/11.21\350\216\267\345\217\226\344\270\213\346\213\211\346\241\206&\350\241\250\345\215\225&\346\267\273\345\212\240\345\261\236\346\200\247.md" @@ -0,0 +1,123 @@ +# style + +获取id 用#id{} + +获取class用 . class{} + +获取标签直接输类似h2，h2{} + +**行间控制style** + +获取行间样式的时候需要进行初始化否则无法获取 + +比如div.style.marginLeft == "" 如果他成立，那就证明没有进行初始化，这时候如果直接修改是不可以的，div.style.marginLeft = 0 + 'px'这就初始化，要不然加不上，类似div.style.marginLeft +10px + +那不就是 “”+10px，初始化之后就是0px+10px，当然需要用parseInt（）把数字单独取出来再+px + +要不然+可能会被看成连接符 + +# 父子节点的获取 + +## 父 + +1、parentNode获取父节点 + +获取的是当前元素的直接父元素。parentNode是w3c的标准。 + +var p = document.getElementById("test").parentNode + +2、parentElement获取父节点 + +parentElement和parentNode一样，只是parentElement是ie的标准。 + +var p1 = document.getElementById("test").parentElement; + +3、offsetParent获取所有父节点 + +一看offset我们就知道是偏移量 其实这个是于位置有关的上下级 ，直接能够获取到所有父亲节点， 这个对应的值是body下的所有节点信息。 + +var p2 = document.getElementById("test").offsetParent; + +## 子 + +1、通过获取DOM方式直接获取子节点 + +其中price为父标签id的值，div为标签的名字。getElementsByTagName是一个方法。返回的是一个数组。在访问的时候按数组的形式访问即可，如var a = document.getElementById("price").getElementsByTagName("div")[0] 返回的是数组里面的第一个元素。 + +var a = document.getElementById("price").getElementsByTagName("div"); +2、通过childNodes 获取子节点 + +childNodes返回的是子节点的集合，也是数组的格式，不过它会把换行和空格也当成节点信息，不推荐使用。 + +var b =document.getElementById("price").childNodes; +3、通过children来获取子节点 + +children获取子元素是最好用的，它返回的也是一个数组，并且会过滤掉一些不必要的信息，如换行、空格等。 + +var c = document.getElementById("price").children; +4、通过firstChild获取第一个子节点 + +firstChild和childNodes类似，浏览器在解析它的时候的时候会把换行和空格一起解析，不推荐使用 + +var d = document.getElementById("price").firstChild; +5、通过firstElementChild获取第一个子节点 + +使用firstElementChild来获取第一个子元素，可直接获取第一个子元素，并不会将换行和空格一起解析 + +var e = document.getElementById("price").firstElementChild; +6、获取最后一个子节点 + +1.lastChild + +2.lastElementChild + +lastChild获取最后一个子节点的方式其实和firstChild是类似的。同样的lastElementChild和firstElementChild也是一样的。不再赘余。 + +var f = document.getElementById("price").lastChild; +var g = document.getElementById("price").lastElementChild + +# 获取和设置属性的值 + +在按钮属性处设一个事件onclick=“某某方法” + +接着在script标签处定义那个某某方法 + +在方法中先找到要添加属性的标钱 + +再用setAttribute（）函数添加 ，有两个参数 + +是一键值对形式存在，第一个参数是属性名，第二个参数是属性的值 + +# 获取表单的值 + +也是一样用个onclick=“某某方法”的事件 + +获取输入框text的值 用.value + +一样用querySelector（）等函数先找到input标签节点 + +或者直接用getElementById找父节点，或者就找一个带id的input + +最后获取用input.value，如果要填一个标签div.innerHTML = '

'+input.value+'

'; + +清楚输入框input.value="" + +## 获取单选框的选中状态 + +通过querySelectorAll获取所有的input的节点 + +通过下标来找的指定的 var input = document.querySelectorAll('input')[1]; + +利用checked来判断是否选中返回值为true或false + +判断 input.checked是否为true或false + +# 获取下拉框 + +用{onchange=(某某方法)}事件获取 + +先获取select标签节点 + +直接在script搞个某某方法就ok + +全选反选也一样先获取input的节点 \ No newline at end of file -- Gitee