为啥js的手册里没有window document等对象的资料？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了为啥js的手册里没有window document等对象的资料？相关的知识，希望对你有一定的参考价值。
难道说这些对象不是js的？？糊涂啊
连getelementbyId这个方法都查不到 难道说这个和js没关系？？还是我的js使用手册有问题
window,document,getElementById这些属于浏览器的DOM，当javascript在浏览器中运行的时候，浏览器属于宿主，然后这些window之类的是宿主提供的对象，js可以获取到并调用而已。
也就是说，js这么语言是可以运行在很多地方的，不仅仅是浏览器，比如Rhino，jsshell等等，他们都可以跑javascript，然后为其提供宿主环境
所以，严格来说，window,document,getElementById这些不属于javascript语言的范畴，所以手册上找不到
你需要找一本讲javascript编程的书，一般都会有这样的章节：客户端的javascript，大部分都是讲浏览器中的javascript，就会介绍上面说的那些方法追问
可不可以这么说 要访问到那个dom 必须要用类似js这类的东西才能访问到 而js只是其中的一种方式
而js 专门为访问这类数据 创造了自己的一些方法如getelementbyid 他们是js但不是在所有宿主上通用的js 所以不在手册上列出
还是说浏览器本身就有一套访问自己属性的语言（是什么?）而js只是调用了他们
可以这么来理解：
javascript是一种编程语言，它需要被解释引擎解释之后才能运行
然后浏览器提供了这样一个解释引擎，比如chrome的V8引擎，firefox的Gecko等等
这些解释引擎不仅仅提供解释js语言并执行的部分，还提供了一个宿主环境让js来运行，该宿主环境就是DOM，BOM之类，这个宿主环境提供了像window这样的浏览器窗口对象，document这样的文档对象，已经提供了getElementById这样的获取html结构的方法，这些东西都属于宿主环境提供的，只不过js在这个宿主环境中运行的时候，可以调用到这些方法，访问到这些对象
js的手册，当然只讲这么语言的特性，不会讲其他东西
怪不得不同的浏览器里写的js会有不同！
参考技术A document、getElementById都是DOM的范畴，准确的说，还真不属于JS追问那属于什么呢 那是神马语言呢。。。一头雾水拉
为啥我的保存功能没有完全执行？
【中文标题】为啥我的保存功能没有完全执行？【英文标题】：Why is my save function not executing in its entirety?为什么我的保存功能没有完全执行？ 【发布时间】：2022-01-20 19:14:51 【问题描述】：我正在尝试用 HTML、CSS 和纯 JS 创建一个待办事项列表。
const dSubmit = document.getElementById('submit');
const storeData = [];
let typer = document.getElementById('type');
let input = document.getElementById('text');
const list = document.getElementById('listHolder');
dSubmit.addEventListener("click", (e) =>
e.preventDefault();
if (input.value == "")
typer.innerHTML = "Please enter a task";
else
typer.innerHTML = "";
store();
);
function store()
const tData = document.getElementById('text').value;
storeData.push(tData);
updater();
input.value = "";
function deleter (index)
storeData.splice(index, 1);
updater();
function updater()
let htmlCode = "";
storeData.forEach(function(item, index)
htmlCode += "<div class='test'><div id = "+ index +">" + item + "</div><div class='sideBtn'><button type='button' class='edit' onClick= 'editF("+ index +")'>Edit</button><button class='delBtn' onClick= 'deleter("+ index +")'>Delete</button> </div> </div>"
)
list.innerHTML = htmlCode;
function editF (index)
let tempOne = document.getElementById(index);
let tempTwo = "<input id='inputText"+String(index)+"' type='text' name='task' value ='" + String(storeData[index]) + "'><button id='saveText"+String(index)+"' onClick= 'save("+index+")' >Save</button>"
tempOne.innerHTML = tempTwo;
function save (index)
console.log('test1')
let tempOne= document.getElementById('saveText'+String(index));
let tempTwo = document.getElementById('inputText'+String(index));
console.log('test2')
tempOne.addEventListener("click", function foo ()
console.log('test3')
storeData.splice(index,1,tempTwo.value)
updater()
)
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<meta charset="utf-8">
<title>To Do List</title>
</head>
<body>
<h1>To-do-list</h1>
<form>
<label for="task">Please enter item:</label>
<input type="text" name="task" id="text">
<button id="submit">Submit</button>
</form>
<div id='type'></div>
<div>List:</div>
<div id="listHolder" class="test"></div>
<script type="text/javascript" src="script.js"></script>
</body>
</html>我遇到了保存功能的问题。如果我编辑待办事项列表中的项目并单击保存按钮，则该函数将执行到 console.log('test2') 为止。如果我再次单击保存，该函数将完整执行。
我想问为什么第一次点击导致执行保存功能直到'test2'？
另外，有人愿意批评我的 JS 吗？有什么急需改进的地方吗？还是有更实用/有效的方法来编写我的 JS 代码？
提前感谢您的帮助。
【问题讨论】：
【参考方案1】：在“test2”日志之后，您将添加一个事件侦听器，其余代码位于侦听器块内。侦听器块中的代码仅在该侦听器收到“点击”事件后才会执行，这就是它第二次工作的原因。
【讨论】：
谢谢，我已经一起删除了事件监听器，所以当点击编辑按钮时保存功能会执行，吸取教训。以上是关于为啥js的手册里没有window document等对象的资料？的主要内容，如果未能解决你的问题，请参考以下文章
nuxt.js引入客户端脚本和第三方库出现window/document/ navigator未定义问题
js怎么获得网页的背景图片 document.body.style.backgroundImage 为啥得不到