注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写
否则会提示你一个错误信息 "引用的元素为空或者不是对象"
---------------------------------------------------------------------
对象属性
document.title //设置文档标题等价于HTML的
标签 <br />
document.bgColor //设置页面背景色 <br />
document.fgColor //设置前景色(文本颜色) <br />
document.linkColor //未点击过的链接颜色 <br />
document.alinkColor //激活链接(焦点在此链接上)的颜色 <br />
document.vlinkColor //已点击过的链接颜色 <br />
document.URL //设置URL属性从而在同一窗口打开另一网页 <br />
document.fileCreatedDate //文件建立日期，只读属性 <br />
document.fileModifiedDate //文件修改日期，只读属性 <br />
document.fileSize //文件大小，只读属性 <br />
document.cookie //设置和读出cookie <br />
document.charset //设置字符集 简体中文:gb2312 <br />
--------------------------------------------------------------------- <br />
常用对象方法 <br />
document.write() //动态向页面写入内容 <br />
document.createElement(Tag) //创建一个html标签对象 <br />
document.getElementById(ID) //获得指定ID值的对象 <br />
document.getElementsByName(Name) //获得指定Name值的对象 <br />
document.body.appendChild(oTag) <br />
--------------------------------------------------------------------- </p>
<p>body-主体子对象 <br />
document.body //指定文档主体的开始和结束等价于<body></body> <br />
document.body.bgColor //设置或获取对象后面的背景颜色 <br />
document.body.link //未点击过的链接颜色 <br />
document.body.alink //激活链接(焦点在此链接上)的颜色 <br />
document.body.vlink //已点击过的链接颜色 <br />
document.body.text //文本色 <br />
document.body.innerText //设置<body>…</body>之间的文本 <br />
document.body.innerHTML //设置<body>…</body>之间的HTML代码 <br />
document.body.topMargin //页面上边距 <br />
document.body.leftMargin //页面左边距 <br />
document.body.rightMargin //页面右边距 <br />
document.body.bottomMargin //页面下边距 <br />
document.body.background //背景图片 </p>
<p>document.body.appendChild(oTag) //动态生成一个HTML对象 </p>
<p>常用对象事件 <br />
document.body.onclick="func()" //鼠标指针单击对象是触发 <br />
document.body.onmouseover="func()" //鼠标指针移到对象时触发 <br />
document.body.onmouseout="func()" //鼠标指针移出对象时触发 <br />
--------------------------------------------------------------------- <br />
location-位置子对象 </p>
<p>document.location.hash // #号后的部分 <br />
document.location.host // 域名+端口号 <br />
document.location.hostname // 域名 <br />
document.location.href // 完整URL <br />
document.location.pathname // 目录部分 <br />
document.location.port // 端口号 <br />
document.location.protocol // 网络协议(http:) <br />
document.location.search // ?号后的部分 </p>
<p>documeny.location.reload() //刷新网页 <br />
document.location.reload(URL) //打开新的网页 <br />
document.location.assign(URL) //打开新的网页 <br />
document.location.replace(URL) //打开新的网页 <br />
--------------------------------------------------------------------- <br />
selection-选区子对象 <br />
document.selection <br />
--------------------------------------------------------------------- </p>
<p>images集合(页面中的图象) </p>
<p>a)通过集合引用 <br />
document.images //对应页面上的<img>标签 <br />
document.images.length //对应页面上<img>标签的个数 <br />
document.images[0] //第1个<img>标签 <br />
document.images[i] //第i-1个<img>标签 </p>
<p>b)通过nane属性直接引用 <br />
<img name="oImage"> <br />
document.images.oImage //document.images.name属性 </p>
<p>c)引用图片的src属性 <br />
document.images.oImage.src //document.images.name属性.src </p>
<p>d)创建一个图象 <br />
var oImage <br />
oImage = new Image() <br />
document.images.oImage.src="1.jpg" <br />
同时在页面上建立一个<img>标签与之对应就可以显示 </p>
<p><html> <br />
<img name=oImage> </p>
<script language="javascript">
var oImage
oImage = new Image()
document.images.oImage.src="1.jpg"
</script>
<p><br />
</html> </p>
<p><html> </p>
<script language="javascript">
oImage=document.caeateElement("IMG")
oImage.src="1.jpg"
document.body.appendChild(oImage)
</script>
<p><br />
</html> </p>
<p>---------------------------------------------------------------------- </p>
<p>forms集合(页面中的表单) </p>
<p>a)通过集合引用 <br />
document.forms //对应页面上的<form>标签 <br />
document.forms.length //对应页面上<form>标签的个数 <br />
document.forms[0] //第1个<form>标签 <br />
document.forms[i] //第i-1个<form>标签 <br />
document.forms[i].length //第i-1个<form>中的控件数 <br />
document.forms[i].elements[j] //第i-1个<form>中第j-1个控件 </p>
<p>b)通过标签name属性直接引用 </p>
<form name="Myform"><input name="myctrl"></form>
<p><br />
document.Myform.myctrl //document.表单名.控件名 </p>
<p>c)访问表单的属性 <br />
document.forms[i].name //对应<form name>属性 <br />
document.forms[i].action //对应<form action>属性 <br />
document.forms[i].encoding //对应<form enctype>属性 <br />
document.forms[i].target //对应<form target>属性 </p>
<p>document.forms[i].appendChild(oTag) //动态插入一个控件 <br />
----------------------------------------------------------------------- <br />
<html> </p>
<!--Text控件相关Script-->
<p><br />
<form name="Myform"> <br />
<input type="text" name="oText"> <br />
<input type="password" name="oPswd"> <br />
<form> </p>
<script language="javascript">
//获取文本密码框的值
document.write(document.Myform.oText.value)
document.write(document.Myform.oPswd.value)
</script>
<p><br />
</html> <br />
----------------------------------------------------------------------- <br />
<html> </p>
<!--checkbox,radio控件相关script-->
<form name="Myform">
<input type="checkbox" name="chk" value="1">1
<input type="checkbox" name="chk" value="2">2
</form>
<p> </p>
<script language="javascript">
function fun(){
//遍历checkbox控件的值并判断是否选中
var length
length=document.forms\[0\].chk.length
for(i=0;i<length;i++){
v=document.forms\[0\].chk\[i\].value
b=document.forms\[0\].chk\[i\].checked
if(b)
alert(v=v+"被选中")
else
alert(v=v+"未选中")
}
}
</script>
<p> <br />
<a rel="nofollow noopener noreferrer" href=# onclick="fun()">ddd</a> <br />
</html> <br />
----------------------------------------------------------------------- <br />
<html> </p>
<!--Select控件相关Script-->
<form name="Myform">
<select name="oSelect">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</form>
<script language="javascript">
//遍历select控件的option项
var length
length=document.Myform.oSelect.length
for(i=0;i<length;i++)
document.write(document.Myform.oSelect\[i\].value)
</script>
<script language="javascript">
//遍历option项并且判断某个option是否被选中
for(i=0;i<document.Myform.oSelect.length;i++){
if(document.Myform.oSelect\[i\].selected!=true)
document.write(document.Myform.oSelect\[i\].value)
else
document.write("<font color=red>"+document.Myform.oSelect\[i\].value+"</font>")
}
</script>
<script language="javascript">
//根据SelectedIndex打印出选中的option
//(0到document.Myform.oSelect.length-1)
i=document.Myform.oSelect.selectedIndex
document.write(document.Myform.oSelect\[i\].value)
</script>
<script language="javascript">
//动态增加select控件的option项
var oOption = document.createElement("OPTION");
oOption.text="4";
oOption.value="4";
document.Myform.oSelect.add(oOption);
</script>
<p><br />
<html> <br />
----------------------------------------------------------------------- </p>
<Div id="oDiv">Text</Div>
<p><br />
document.all.oDiv //引用图层oDiv <br />
document.all.oDiv.style.display="" //图层设置为可视 <br />
document.all.oDiv.style.display="none" //图层设置为隐藏 <br />
document.getElementId("oDiv") //通过getElementId引用对象 <br />
document.getElementId("oDiv").style="" <br />
document.getElementId("oDiv").display="none" <br />
/*document.all表示document中所有对象的集合 <br />
只有ie支持此属性，因此也用来判断浏览器的种类*/ </p>
<p>图层对象的4个属性 <br />
document.getElementById("ID").innerText //动态输出文本 <br />
document.getElementById("ID").innerHTML //动态输出HTML <br />
document.getElementById("ID").outerText //同innerText <br />
document.getElementById("ID").outerHTML //同innerHTML </p>
<h3 id="来源：python脚本自动迁移httpwdtxslqnnblog163comblogstatic4424648520115208362446">来源：<a rel="nofollow noopener noreferrer" href="http://wdtxslqnn.blog.163.com/blog/static/4424648520115208362446/">python脚本自动迁移</a></h3></div></div><div class="MuiGrid-root jss8 MuiGrid-item MuiGrid-grid-xs-true MuiGrid-grid-md-3"><div class="MuiTypography-root jss26 MuiTypography-body1"><div class="MuiTypography-root jss27 MuiTypography-body1"><canvas style="height:108px;width:108px" height="108" width="108"></canvas><div class="MuiTypography-root jss28 MuiTypography-body1"><p class="MuiTypography-root jss29 MuiTypography-body1">手机扫一扫</p><p class="MuiTypography-root jss29 MuiTypography-body1">移动阅读更方便</p></div></div></div><div class="MuiTypography-root jss9 MuiTypography-body1"><div class="MuiTypography-root jss30 MuiTypography-body1" style="height:150px"><div class="swiper-container jss32"><div class="swiper-pagination"></div><div class="swiper-wrapper"><div class="swiper-slide jss32"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss32 MuiTypography-colorInherit" target="_blank" rel="nofollow noopener noreferrer" href="https://qd.rs/aliyun"><img alt="阿里云服务器" class="jss31" src="https://article.cdnof.com/promotion/aliyun.jpg"/></a></div><div class="swiper-slide jss32"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss32 MuiTypography-colorInherit" target="_blank" rel="nofollow noopener noreferrer" href="https://qd.rs/tencent"><img alt="腾讯云服务器" class="jss31" src="https://article.cdnof.com/promotion/tencent.jpg"/></a></div><div class="swiper-slide jss32"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss32 MuiTypography-colorInherit" target="_blank" rel="nofollow noopener noreferrer" href="https://qd.rs/qiniu"><img alt="七牛云服务器" class="jss31" src="https://article.cdnof.com/promotion/qiniu.png"/></a></div></div></div></div></div><div class="MuiTypography-root MuiTypography-body1"><div class="MuiTypography-root jss33 MuiTypography-body1"><p class="MuiTypography-root jss34 MuiTypography-body1">你可能感兴趣的文章</p><div class="MuiList-root MuiList-padding" aria-label="main mailbox folders"><div class="MuiTypography-root MuiTypography-body1"><div class="MuiButtonBase-root MuiListItem-root jss37 MuiListItem-gutters MuiListItem-button" tabindex="0" role="button" aria-disabled="false"><div class="MuiListItemIcon-root jss36"><svg class="MuiSvgIcon-root MuiSvgIcon-colorError" focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14h-2V9h-2V7h4v10z"></path></svg></div><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss35 MuiTypography-colorInherit" target="_blank" href="https://v2as.com/article/fafd6265-f655-4083-958f-8644436eb148">Vue源码学习(二):<templete>渲染第一步,模板解析</a></div><hr class="MuiDivider-root"/></div><div class="MuiTypography-root MuiTypography-body1"><div class="MuiButtonBase-root MuiListItem-root jss37 MuiListItem-gutters MuiListItem-button" tabindex="0" role="button" aria-disabled="false"><div class="MuiListItemIcon-root jss36"><svg class="MuiSvgIcon-root" focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-4 8c0 1.11-.9 2-2 2h-2v2h4v2H9v-4c0-1.11.9-2 2-2h2V9H9V7h4c1.1 0 2 .89 2 2v2z"></path></svg></div><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss35 MuiTypography-colorInherit" target="_blank" href="https://v2as.com/article/3f61888b-2e1f-447a-bb05-0d4cd823108e">React框架学习基础篇-HelloReact-01</a></div><hr class="MuiDivider-root"/></div><div class="MuiTypography-root MuiTypography-body1"><div class="MuiButtonBase-root MuiListItem-root jss37 MuiListItem-gutters MuiListItem-button" tabindex="0" role="button" aria-disabled="false"><div class="MuiListItemIcon-root jss36"><svg class="MuiSvgIcon-root MuiSvgIcon-colorSecondary" focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M19.01 3h-14c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-4 7.5c0 .83-.67 1.5-1.5 1.5.83 0 1.5.67 1.5 1.5V15c0 1.11-.9 2-2 2h-4v-2h4v-2h-2v-2h2V9h-4V7h4c1.1 0 2 .89 2 2v1.5z"></path></svg></div><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss35 MuiTypography-colorInherit" target="_blank" href="https://v2as.com/article/04353178-30ff-4ea0-acec-e1b3cf471bd3">elasticsearch wildcard 慢查询原因分析(深入到源码!!!)</a></div></div></div></div></div></div></div></div><footer style="margin-top:30px"><p class="MuiTypography-root MuiTypography-body2 MuiTypography-colorTextSecondary MuiTypography-alignCenter">Copyright © <a class="MuiTypography-root MuiLink-root MuiLink-underlineHover MuiTypography-colorInherit" href="https://v2as.com" title="哇哦，有大量工具等你探索">V2AS | 问路</a> <!-- -->2024<!-- --> <!-- -->.</p><p class="MuiTypography-root MuiTypography-body2 MuiTypography-colorTextSecondary MuiTypography-alignCenter"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover MuiTypography-colorInherit" rel="nofollow noopener noreferrer" href="https://beian.miit.gov.cn/">浙ICP备15029886号</a></p></footer></div></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"article":{"article_id":"599fb678-541e-4c3f-b241-fd4e07c914c6","title":"document对象常用属性","link":"","description":"转载请注明来源：https://www.cnblogs.com/hookjc/\n注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写 否则会提示你一个错误信息 \"引用的元素为空或者不是对象\"--------------------------------------------------------------------- 对象属性document.title ","image":"","keywords":["document","body","属性","对象","script","form","Myform","location","forms","页面"],"created_at":"2023-07-10T17:07:14.708Z","html":"\u003ch3 id=\"转载请注明来源：httpswwwcnblogscomhookjchttpswwwcnblogscomhookjc\"\u003e转载请注明来源：\u003ca rel=\"nofollow noopener noreferrer\" href=\"https://www.cnblogs.com/hookjc/\"\u003ehttps://www.cnblogs.com/hookjc/\u003c/a\u003e\u003c/h3\u003e\n\u003cp\u003e注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写 \u003cbr /\u003e\n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;否则会提示你一个错误信息 \"引用的元素为空或者不是对象\" \u003cbr /\u003e\n--------------------------------------------------------------------- \u003cbr /\u003e\n对象属性 \u003cbr /\u003e\ndocument.title\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置文档标题等价于HTML的\u003ctitle\u003e标签 \u003cbr /\u003e\ndocument.bgColor\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置页面背景色 \u003cbr /\u003e\ndocument.fgColor\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置前景色(文本颜色) \u003cbr /\u003e\ndocument.linkColor\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//未点击过的链接颜色 \u003cbr /\u003e\ndocument.alinkColor\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //激活链接(焦点在此链接上)的颜色 \u003cbr /\u003e\ndocument.vlinkColor\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //已点击过的链接颜色 \u003cbr /\u003e\ndocument.URL\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置URL属性从而在同一窗口打开另一网页 \u003cbr /\u003e\ndocument.fileCreatedDate\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//文件建立日期，只读属性 \u003cbr /\u003e\ndocument.fileModifiedDate\u0026nbsp;\u0026nbsp; //文件修改日期，只读属性 \u003cbr /\u003e\ndocument.fileSize\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //文件大小，只读属性 \u003cbr /\u003e\ndocument.cookie\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //设置和读出cookie \u003cbr /\u003e\ndocument.charset\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置字符集 简体中文:gb2312 \u003cbr /\u003e\n--------------------------------------------------------------------- \u003cbr /\u003e\n常用对象方法 \u003cbr /\u003e\ndocument.write()\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //动态向页面写入内容 \u003cbr /\u003e\ndocument.createElement(Tag)\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//创建一个html标签对象 \u003cbr /\u003e\ndocument.getElementById(ID)\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//获得指定ID值的对象 \u003cbr /\u003e\ndocument.getElementsByName(Name)\u0026nbsp;\u0026nbsp; //获得指定Name值的对象 \u003cbr /\u003e\ndocument.body.appendChild(oTag) \u003cbr /\u003e\n--------------------------------------------------------------------- \u003c/p\u003e\n\u003cp\u003ebody-主体子对象 \u003cbr /\u003e\ndocument.body\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//指定文档主体的开始和结束等价于\u003cbody\u003e\u003c/body\u003e \u003cbr /\u003e\ndocument.body.bgColor\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置或获取对象后面的背景颜色 \u003cbr /\u003e\ndocument.body.link\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //未点击过的链接颜色 \u003cbr /\u003e\ndocument.body.alink\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//激活链接(焦点在此链接上)的颜色 \u003cbr /\u003e\ndocument.body.vlink\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//已点击过的链接颜色 \u003cbr /\u003e\ndocument.body.text\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //文本色 \u003cbr /\u003e\ndocument.body.innerText\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置\u003cbody\u003e…\u003c/body\u003e之间的文本 \u003cbr /\u003e\ndocument.body.innerHTML\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//设置\u003cbody\u003e…\u003c/body\u003e之间的HTML代码 \u003cbr /\u003e\ndocument.body.topMargin\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//页面上边距 \u003cbr /\u003e\ndocument.body.leftMargin\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //页面左边距 \u003cbr /\u003e\ndocument.body.rightMargin\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//页面右边距 \u003cbr /\u003e\ndocument.body.bottomMargin\u0026nbsp;\u0026nbsp; //页面下边距 \u003cbr /\u003e\ndocument.body.background\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //背景图片 \u003c/p\u003e\n\u003cp\u003edocument.body.appendChild(oTag) //动态生成一个HTML对象 \u003c/p\u003e\n\u003cp\u003e常用对象事件 \u003cbr /\u003e\ndocument.body.onclick=\"func()\"\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //鼠标指针单击对象是触发 \u003cbr /\u003e\ndocument.body.onmouseover=\"func()\"\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //鼠标指针移到对象时触发 \u003cbr /\u003e\ndocument.body.onmouseout=\"func()\"\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//鼠标指针移出对象时触发 \u003cbr /\u003e\n--------------------------------------------------------------------- \u003cbr /\u003e\nlocation-位置子对象 \u003c/p\u003e\n\u003cp\u003edocument.location.hash\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; // #号后的部分 \u003cbr /\u003e\ndocument.location.host\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; // 域名+端口号 \u003cbr /\u003e\ndocument.location.hostname\u0026nbsp;\u0026nbsp; // 域名 \u003cbr /\u003e\ndocument.location.href\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; // 完整URL \u003cbr /\u003e\ndocument.location.pathname\u0026nbsp;\u0026nbsp; // 目录部分 \u003cbr /\u003e\ndocument.location.port\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; // 端口号 \u003cbr /\u003e\ndocument.location.protocol\u0026nbsp;\u0026nbsp; // 网络协议(http:) \u003cbr /\u003e\ndocument.location.search\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; // ?号后的部分 \u003c/p\u003e\n\u003cp\u003edocumeny.location.reload()\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //刷新网页 \u003cbr /\u003e\ndocument.location.reload(URL)\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//打开新的网页 \u003cbr /\u003e\ndocument.location.assign(URL)\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//打开新的网页 \u003cbr /\u003e\ndocument.location.replace(URL)\u0026nbsp;\u0026nbsp; //打开新的网页 \u003cbr /\u003e\n--------------------------------------------------------------------- \u003cbr /\u003e\nselection-选区子对象 \u003cbr /\u003e\ndocument.selection \u003cbr /\u003e\n--------------------------------------------------------------------- \u003c/p\u003e\n\u003cp\u003eimages集合(页面中的图象) \u003c/p\u003e\n\u003cp\u003ea)通过集合引用 \u003cbr /\u003e\ndocument.images\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//对应页面上的\u003cimg\u003e标签 \u003cbr /\u003e\ndocument.images.length\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //对应页面上\u003cimg\u003e标签的个数 \u003cbr /\u003e\ndocument.images[0]\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //第1个\u003cimg\u003e标签\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \u003cbr /\u003e\ndocument.images[i]\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //第i-1个\u003cimg\u003e标签 \u003c/p\u003e\n\u003cp\u003eb)通过nane属性直接引用 \u003cbr /\u003e\n\u003cimg name=\"oImage\"\u003e \u003cbr /\u003e\ndocument.images.oImage\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //document.images.name属性 \u003c/p\u003e\n\u003cp\u003ec)引用图片的src属性 \u003cbr /\u003e\ndocument.images.oImage.src\u0026nbsp;\u0026nbsp; //document.images.name属性.src \u003c/p\u003e\n\u003cp\u003ed)创建一个图象 \u003cbr /\u003e\nvar oImage \u003cbr /\u003e\noImage = new Image() \u003cbr /\u003e\ndocument.images.oImage.src=\"1.jpg\" \u003cbr /\u003e\n同时在页面上建立一个\u003cimg\u003e标签与之对应就可以显示 \u003c/p\u003e\n\u003cp\u003e\u003chtml\u003e \u003cbr /\u003e\n\u003cimg name=oImage\u003e \u003c/p\u003e\n\u003cscript language=\"javascript\"\u003e \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;var oImage \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;oImage = new Image() \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;document.images.oImage.src=\"1.jpg\" \n\u003c/script\u003e\n\u003cp\u003e\u003cbr /\u003e\n\u003c/html\u003e \u003c/p\u003e\n\u003cp\u003e\u003chtml\u003e \u003c/p\u003e\n\u003cscript language=\"javascript\"\u003e \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;oImage=document.caeateElement(\"IMG\") \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;oImage.src=\"1.jpg\" \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;document.body.appendChild(oImage) \n\u003c/script\u003e\n\u003cp\u003e\u003cbr /\u003e\n\u003c/html\u003e \u003c/p\u003e\n\u003cp\u003e---------------------------------------------------------------------- \u003c/p\u003e\n\u003cp\u003eforms集合(页面中的表单) \u003c/p\u003e\n\u003cp\u003ea)通过集合引用 \u003cbr /\u003e\ndocument.forms\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//对应页面上的\u003cform\u003e标签 \u003cbr /\u003e\ndocument.forms.length\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //对应页面上\u003cform\u003e标签的个数 \u003cbr /\u003e\ndocument.forms[0]\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //第1个\u003cform\u003e标签 \u003cbr /\u003e\ndocument.forms[i]\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //第i-1个\u003cform\u003e标签 \u003cbr /\u003e\ndocument.forms[i].length\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//第i-1个\u003cform\u003e中的控件数 \u003cbr /\u003e\ndocument.forms[i].elements[j]\u0026nbsp;\u0026nbsp; //第i-1个\u003cform\u003e中第j-1个控件 \u003c/p\u003e\n\u003cp\u003eb)通过标签name属性直接引用 \u003c/p\u003e\n\u003cform name=\"Myform\"\u003e\u003cinput name=\"myctrl\"\u003e\u003c/form\u003e\n\u003cp\u003e\u003cbr /\u003e\ndocument.Myform.myctrl\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//document.表单名.控件名 \u003c/p\u003e\n\u003cp\u003ec)访问表单的属性 \u003cbr /\u003e\ndocument.forms[i].name\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//对应\u003cform name\u003e属性 \u003cbr /\u003e\ndocument.forms[i].action\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//对应\u003cform action\u003e属性 \u003cbr /\u003e\ndocument.forms[i].encoding\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//对应\u003cform enctype\u003e属性 \u003cbr /\u003e\ndocument.forms[i].target\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//对应\u003cform target\u003e属性 \u003c/p\u003e\n\u003cp\u003edocument.forms[i].appendChild(oTag) //动态插入一个控件 \u003cbr /\u003e\n----------------------------------------------------------------------- \u003cbr /\u003e\n\u003chtml\u003e \u003c/p\u003e\n\u003c!--Text控件相关Script--\u003e\n\u003cp\u003e\u003cbr /\u003e\n\u003cform name=\"Myform\"\u003e \u003cbr /\u003e\n\u003cinput type=\"text\" name=\"oText\"\u003e \u003cbr /\u003e\n\u003cinput type=\"password\" name=\"oPswd\"\u003e \u003cbr /\u003e\n\u003cform\u003e \u003c/p\u003e\n\u003cscript language=\"javascript\"\u003e \n//获取文本密码框的值 \ndocument.write(document.Myform.oText.value) \ndocument.write(document.Myform.oPswd.value) \n\u003c/script\u003e\n\u003cp\u003e\u003cbr /\u003e\n\u003c/html\u003e \u003cbr /\u003e\n----------------------------------------------------------------------- \u003cbr /\u003e\n\u003chtml\u003e \u003c/p\u003e\n\u003c!--checkbox,radio控件相关script--\u003e\n\u003cform name=\"Myform\"\u003e \n\u003cinput type=\"checkbox\" name=\"chk\" value=\"1\"\u003e1\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u003cinput type=\"checkbox\" name=\"chk\" value=\"2\"\u003e2\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u003c/form\u003e\n\u003cp\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \u003c/p\u003e\n\u003cscript language=\"javascript\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \nfunction fun(){\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; //遍历checkbox控件的值并判断是否选中\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; var length\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; length=document.forms\\[0\\].chk.length\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; for(i=0;i\u003clength;i++){\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; v=document.forms\\[0\\].chk\\[i\\].value\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; b=document.forms\\[0\\].chk\\[i\\].checked\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; if(b)\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; alert(v=v+\"被选中\")\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; else\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; alert(v=v+\"未选中\")\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; }\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp; }\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \n\u003c/script\u003e\n\u003cp\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \u003cbr /\u003e\n\u003ca rel=\"nofollow noopener noreferrer\" href=# onclick=\"fun()\"\u003eddd\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \u003cbr /\u003e\n\u003c/html\u003e \u003cbr /\u003e\n----------------------------------------------------------------------- \u003cbr /\u003e\n\u003chtml\u003e \u003c/p\u003e\n\u003c!--Select控件相关Script--\u003e\n\u003cform name=\"Myform\"\u003e \n\u003cselect name=\"oSelect\"\u003e \n\u003coption value=\"1\"\u003e1\u003c/option\u003e \n\u003coption value=\"2\"\u003e2\u003c/option\u003e \n\u003coption value=\"3\"\u003e3\u003c/option\u003e \n\u003c/select\u003e \n\u003c/form\u003e\n\u003cscript language=\"javascript\"\u003e \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//遍历select控件的option项 \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;var length \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;length=document.Myform.oSelect.length \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;for(i=0;i\u003clength;i++) \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;document.write(document.Myform.oSelect\\[i\\].value) \n\u003c/script\u003e\n\u003cscript language=\"javascript\"\u003e \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//遍历option项并且判断某个option是否被选中 \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;for(i=0;i\u003cdocument.Myform.oSelect.length;i++){ \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;if(document.Myform.oSelect\\[i\\].selected!=true) \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;document.write(document.Myform.oSelect\\[i\\].value) \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;else \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;document.write(\"\u003cfont color=red\u003e\"+document.Myform.oSelect\\[i\\].value+\"\u003c/font\u003e\")\u0026nbsp;\u0026nbsp; \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;} \n\u003c/script\u003e\n\u003cscript language=\"javascript\"\u003e \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//根据SelectedIndex打印出选中的option \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//(0到document.Myform.oSelect.length-1) \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;i=document.Myform.oSelect.selectedIndex \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;document.write(document.Myform.oSelect\\[i\\].value) \n\u003c/script\u003e\n\u003cscript language=\"javascript\"\u003e \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//动态增加select控件的option项 \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;var oOption = document.createElement(\"OPTION\"); \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;oOption.text=\"4\"; \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;oOption.value=\"4\"; \n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;document.Myform.oSelect.add(oOption); \n\u003c/script\u003e\n\u003cp\u003e\u003cbr /\u003e\n\u003chtml\u003e \u003cbr /\u003e\n----------------------------------------------------------------------- \u003c/p\u003e\n\u003cDiv id=\"oDiv\"\u003eText\u003c/Div\u003e\n\u003cp\u003e\u003cbr /\u003e\ndocument.all.oDiv\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //引用图层oDiv\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; \u003cbr /\u003e\ndocument.all.oDiv.style.display=\"\"\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//图层设置为可视 \u003cbr /\u003e\ndocument.all.oDiv.style.display=\"none\"\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;//图层设置为隐藏 \u003cbr /\u003e\ndocument.getElementId(\"oDiv\")\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp; //通过getElementId引用对象 \u003cbr /\u003e\ndocument.getElementId(\"oDiv\").style=\"\" \u003cbr /\u003e\ndocument.getElementId(\"oDiv\").display=\"none\" \u003cbr /\u003e\n/*document.all表示document中所有对象的集合 \u003cbr /\u003e\n只有ie支持此属性，因此也用来判断浏览器的种类*/ \u003c/p\u003e\n\u003cp\u003e图层对象的4个属性 \u003cbr /\u003e\ndocument.getElementById(\"ID\").innerText\u0026nbsp;\u0026nbsp; //动态输出文本 \u003cbr /\u003e\ndocument.getElementById(\"ID\").innerHTML\u0026nbsp;\u0026nbsp; //动态输出HTML \u003cbr /\u003e\ndocument.getElementById(\"ID\").outerText\u0026nbsp;\u0026nbsp; //同innerText \u003cbr /\u003e\ndocument.getElementById(\"ID\").outerHTML\u0026nbsp;\u0026nbsp; //同innerHTML \u003c/p\u003e\n\u003ch3 id=\"来源：python脚本自动迁移httpwdtxslqnnblog163comblogstatic4424648520115208362446\"\u003e来源：\u003ca rel=\"nofollow noopener noreferrer\" href=\"http://wdtxslqnn.blog.163.com/blog/static/4424648520115208362446/\"\u003epython脚本自动迁移\u003c/a\u003e\u003c/h3\u003e"},"seo":{"title":"document对象常用属性","description":"转载请注明来源：https://www.cnblogs.com/hookjc/\n注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写 否则会提示你一个错误信息 \"引用的元素为空或者不是对象\"--------------------------------------------------------------------- 对象属性document.title ","image":"","url":"https://v2as.com/article/599fb678-541e-4c3f-b241-fd4e07c914c6","keywords":["document","body","属性","对象","script","form","Myform","location","forms","页面"]},"viewsCount":1,"promotionList":[{"title":"阿里云服务器","image":"https://article.cdnof.com/promotion/aliyun.jpg","link":"https://qd.rs/aliyun"},{"title":"腾讯云服务器","image":"https://article.cdnof.com/promotion/tencent.jpg","link":"https://qd.rs/tencent"},{"title":"七牛云服务器","image":"https://article.cdnof.com/promotion/qiniu.png","link":"https://qd.rs/qiniu"}],"similarKeywordsList":[{"article_id":"fafd6265-f655-4083-958f-8644436eb148","title":"Vue源码学习(二):\u003ctemplete\u003e渲染第一步,模板解析","link":"","description":"好家伙，\n1.\u003ctemplate\u003e去哪了\n在正式内容之前,我们来思考一个问题,\n当我们使用vue开发页面时,\u003ctamplete\u003e中的内容是如何变成我们网页中的内容的?\n它会经历四步:\n解析模板：Vue会解析\u003ctemplate\u003e中的内容，识别出其中的指令、插值表达式（{{}}），以及其他元素和属性。\n生成AST：解析模板后，Vue会生成一个对应的AST（Abstract Syntax Tree，抽象","image":"https://article.cdnof.com/2309/4891cc55-d487-4dac-9b0f-f4238686611e.png","keywords":["Vue","log","console","html","源码","el","div","标签","options","function"],"created_at":"0001-01-01T00:00:00Z"},{"article_id":"3f61888b-2e1f-447a-bb05-0d4cd823108e","title":"React框架学习基础篇-HelloReact-01","link":"","description":"一直想掌握一门前端技术，于是想跟着张天宇老师学习，便开始学习React，以此来记录一下我的学习之旅。\n学习一门新的技术首先是去官网看看，React官网链接是[https://zh-hans.reactjs.org/]。\n\n\n\n可以看到非常的清爽，React的特点简介，见名知意不做过多介绍\n声明式\n组件化\n一次学习，跨平台编写\n一般学习一门新东西都是先写一个HelloWorld来看看效果，于是我们之","image":"https://article.cdnof.com/2309/6ad7810f-eb65-43fe-9f91-6c849fc60a31.png","keywords":["js","React","学习","script","框架","html","基础","jsx","DOM","adsbygoogle"],"created_at":"0001-01-01T00:00:00Z"},{"article_id":"04353178-30ff-4ea0-acec-e1b3cf471bd3","title":"elasticsearch wildcard 慢查询原因分析(深入到源码!!!)","link":"","description":"大家好，我是蓝胖子，前段时间线上elasticsearch集群遇到多次wildcard产生的性能问题， elasticsearch wildcard 一直是容易引发elasticsearch 容易宕机的一个风险点， 但究竟它为何消耗cpu呢？又该如何理解elasticsearch profile api的返回结果呢？在探索了部分源码后，我将在这篇文章一一揭晓答案。\n学完这篇文章，你可以学到如下内","image":"https://article.cdnof.com/2309/d9e04b58-b4d8-4810-a22a-64e0a56e58a8.jpg","keywords":["查询","源码","文档","lucece","elasticsearch","weight","方法","search","scorer","score"],"created_at":"0001-01-01T00:00:00Z"}]},"__N_SSG":true},"page":"/article/[article_id]","query":{"article_id":"599fb678-541e-4c3f-b241-fd4e07c914c6"},"buildId":"7EtL49Y65E8zx1NwcIC_o","isFallback":false,"gsp":true,"scriptLoader":[]}</script></body></html>