JavaScript的document对象

JavaScript的`document`对象

一、`document`对象的概念

浏览器对外提供的支持js的用来操作HTML文档的一个对象，此对象封存的HTML文档的所有信息。

Document节点：DOM全称为Document Object Model，即文档对象模型，是一套管理控制HTML文档的规则，而Document节点则是一种具象化的表现形式

如果把整个HTML文档看成一个对象，那么这个对象就是Document节点，而如何操作控制这个对象的标准，就是DOM

DOM中规定HTML页面中所有的元素都是节点，可以通过Document点号运算符调用所有元素

Document节点又被称作Document对象，每个载入浏览器的HTML文档都会成为Document对象，document是HTML文档的根节点

因此，为了在脚本（Script）中操作页面，提出了Document节点和DOM规则

二, `Document`属性分类：

使用较多的属性有以下三类

第一类：
doctype，documentElement，body，head，用于返回文档内部的某个节点

第二类：
documentURI，URL，domain，lastModified，location，title，readyState，用于返回文档指定的信息

第三类：
anchors，forms，images，links，scripts，用于返回文档内部特定节点的集合

`Document`节点属性：

document.title//设置文档标题，与HTNL中的title标签等价
document.bgColor//设置页面背景颜色
document.fgColor//设置页面前景色
document.fileCreateDate//文件建立日期，只读属性
document.fileModifiedDate//文件修改日期，只读属性
document.URL//可返回当前文档的URL
document.linkColor//未点击过的链接颜色
doucment.alinkColor//鼠标在此链接上的颜色
document.vlinkColor//已点击过的链接颜色
document.charset//设置字符集，简体中文为gb2312
document.fileSize//文件大小，只读属性
document.cookies//设置和读出cookie

`document`的常用方法：

document.createElement(Tag)//创建HTML元素
document.getElementById(ID)//获得指定id值的对象
document.getElementByName(name)//获得name值的对象
document.write()//动态向页面写内容
document.body.appendChild(oTag)//向节点添加最后一个子节点

`常用对象`事件：

document.body.onclick=”func()” //鼠标指针单击对象是触发 
document.body.onmouseover=”func()” //鼠标指针移到对象时触发 
document.body.onmouseout=”func()” //鼠标指针移出对象时触发

`body`主体子对象：

document.body//指定文档主体的开始和结束,等价于body>/body>
document.body.bgColor//设置或获取对象的背景颜色
document.body.link//未点击过的连接颜色
document.body.alink//鼠标在链接上时的颜色
document.body.vlink//点击过的链接颜色
document.body.text//文本颜色
document.body.topMargin//页面上边距
document.body.leftMargin //页面左边距 
document.body.rightMargin //页面右边距 
document.body.bottomMargin //页面下边距 
documenr.body.background//背景图片
document.body.appendChild(oTag)//动态生成一个Html对象

三、使用`document`

第一类属性

① 对于HTML文档来说，document对象一般有两个子节点，第一个子节点就是 docType（第二个是html）
docType节点是一个对象，包含了当前文档的类型信息，对于HTML5文档来说，docType节点就代表<!DOCTYPE html>

语法：document .docType;

② documentElement属性表示当前文档的根节点，通常是document的节点的第二个子节点，紧跟在document.docType节点后面
但是，一般情况下都是通过documentElement节点来访问当前页面中的其他子节点

语法：document .documentElement

③ body属性返回当前文档的body或frameset节点，如果不存在这样的节点则返回null

语法：document .body；

④head属性返回当前文档的head节点，如果当前文档有多个head，则返回第一个

语法：document .head；

第二类属性

①documentURI属性返回当前文档的网址，所有文档都具备该属性

语法：document .documentURI

②URL属性返回当前文档的网址，URL属性只有HTML文档才具备，该属性为只读属性不能写入

语法：document .URL

③domain属性返回当前文档的域名，如果无法获取域名则返回null

语法：document .domain

④lastModified属性返回当前文档（网页）最后修改的时间戳，格式为字符串

语法：document .lastModified

注意，lastModified属性的返回值是字符串，所以不能直接用于比较，如果要比较两个文档哪一个时间更新，则需要将其转换成时间戳格式
语法示例：Date.parse(doc1.lastModifyed)，Date.parse方法能够将时间格式的字符串转换成时间戳格式

⑤location属性返回一个只读对象，提供了当前文档的URL信息

document.location.href，返回完整的URL，可以写入（指定新网址）
document.location.protocol，返回当前遵守的协议
document.location.host，返回当前页面域名+端口号
document.location.hostname，返回当前页面域名
document.location.port，返回当前页面端口号
document.location.pathname，返回当前页面在服务器中的路径
document.location.search，返回当前页面URL中的查询字符串
document.location.assign('网页地址')，跳转到另一个网址（与第一种的用法有相似之处）

⑥location其他内容
以下方法效果相同，都能改变当前页面的URL

location.assign('传递一个URL')；
window.location = '传递一个URL'；
location.href = '传递一个URL'；（常用方式）
reload():重新加载当前显示的页面
location.reload(false):  //优先从本地缓存重新加载
location.reload(true):  //优先从服务器重新加载

location对象的 search属性获取URL中保存的页面提交的字符串信息

⑦ title属性返回当前文档的标题，该属性是可写的

语法：document.title
写入信息时：document.title = '写入的标题'；

⑧ characterSet属性返回渲染当前文档的字符集，比如UTF-8、ISO-8859-1等

语法：document.characterSet

⑨readyState属性返回当前文档的状态，返回值包括三种：

loading: 表示加载HTML代码阶段，尚未完成解析
interactive: 表示加载外部资源阶段
complete:  表示全部加载完成

第三类属性

这些集合都是动态的，原节点有任何变化会立刻反映在集合中

① anchors属性返回网页中所有指定了 name属性的 a标签元素

②forms属性返回网页中所有的表单

③images属性返回网页中所有的图片

④ links属性返回网页中所有链接元素（带有href属性的 a标签）

⑤ scripts属性返回网页中所有的脚本

<body>
    <a href="#" name="anchorFirst">链接first</a>
    <a href="#" >链接second</a>
    <a href="#" name="anchorThird">链接third</a>
<script>
    var coll=document.anchors;
    console.log(coll);  //打印所有定义了 name属性的 a标签元素，返回值为结合
    console.log(typeof coll);  //返回值类型为 Object
    console.log(coll[1]);  //打印指定的定义了 name属性的 a标签元素
</script>
</body>

document选择页面元素
① querySelector()方法返回匹配指定的CSS选择器的元素节点，
如果多个节点满足匹配条件，则返回第一个匹配的节点
如果没有满足匹配条件的节点，则返回 null

语法：document .querySelector('元素选择器 | 类选择器 | id选择器');

② querySelectorAll()方法用来根据指定的选择器进行页面元素筛选
如果多个元素满足匹配条件，则返回这些元素构成的集合

语法：document .querySelectorAll('选择器名')；

返回值为一个节点列表，不是数组，但可以像数组一样使用列表
如果查找失败不是返回null，而是返回一个空的节点列表

③ 其他常用选择方式

getElementById()，返回匹配指定 id属性的元素节点
getElementByTagName()，返回所有匹配指定标签的元素节点
getElementByClassName()，返回符合指定类名的所有元素节点
getElementByName()，返回匹配指定 name属性的所有元素节点

注意，上述方法中直接使用类名、id名等，并不是选择器名！！

document创建页面元素、属性

①createElement()，生成HTML元素节点

语法：var newElem=document .createElement(‘标签名’)；  //所创建节点名需使用引号

注意，该方法创建的页面元素不会直接显示在页面中，而是默认存储在内存中

② appendChild()，通过该方法将创建的元素添加到页面的指定父元素中

语法：父元素名 .appendChild(newElem)；

③ createTextNode()，该方法用于对新建元素添加内容，方法的参数为需要生成的文本内容节点

语法：var elemText=document .createTextNode(' 需要添加的文本节点内容 ')；
newElem .appendChild(elemText);

另外，还可以使用innerHtml属性设置或返回双标签之间的HTML内容

语法：元素节点（变量名）.innerHtml=' text ';

④ createAttribute()方法用于创建属性对象节点，返回值为属性本身

语法：var elemStyle=document.createAttribute(' 属性名 ')；
elemStyle .value='color : red';     // 使用 .value对属性赋值

⑤ setAttributeNode()方法用于将属性节点添加到元素中，进而实现元素的属性设置

语法：newElem.setAttributeNode(elemStyle);

<script>
    var newElem=document.createElement('p');                        //创建<p>标签
    var elemText=document.createTextNode('祝天下单身狗情人节快乐！');   //创建元素内容节点
    newElem.appendChild(elemText);                          //将内容节点添加给<p>标签
    var elemAttrStyle=document.createAttribute('style');           //创建“style”属性
    // var elemAttrAlign=document.createAttribute('align');           //创建“align”属性
    elemAttrStyle.value=('color:red;text-align:center;font-size:25px');     //向“style”属性赋值
    // elemAttrAlign.value=('center');               //向“align”属性赋值
    newElem.setAttributeNode(elemAttrStyle);                //将“style”属性添加给<p>标签
    // newElem.setAttributeNode(elemAttrAlign);                //将“align”属性添加给<p>标签
    var body=document.querySelector('body');                       //选择页面<body>标签
    body.appendChild(newElem);                              //将<p>标签添加到页面body中
</script>

操作元素属性的方法

操作Element节点的CSS样式，最简单的方法之一是使用节点对象的以下三种方法，进行读、写、删HTML元素的style属性

①getAttribute()，获取Element属性，语法：元素节点 .getAttribute(' 属性名 ')；，返回值为属性值

② setAttribute()，设置Element属性，语法：元素节点 .setAttribute(' 属性名 ' , ' 属性值 ')；

③ removeAttribute()，删除Element属性，语法：元素节点 .removeAttribute(' 属性名 ')；

元素节点的style属性
Element节点本身也提供了style属性用于操作CSS样式，style属性指向一个对象，用于读写页面元素的行内CSS样式。

<script>
    var newElem=document.createElement('p');                        //创建<p>标签
    var elemText=document.createTextNode('祝天下单身狗情人节快乐！');   //创建元素内容节点
    newElem.appendChild(elemText);                          //将内容节点添加给<p>标签
    newElem.style.textAlign='center';
    newElem.style.backgroundColor='hotpink';
    newElem.style.borderBottom='2px solid darkgreen';
    newElem.style.color='blue';
    newElem.style.fontSize='25px';
    newElem.style.cssFloat='none';                          //float为JavaScript保留字
    document.body.appendChild(newElem);                            //将<p>标签添加到页面body中
</script>

注意：元素的 style对象对应元素的 style属性，style对象中的样式与 style属性中的样式名称是一一对应的，但书写规则有一定差别

① 将横杠（-）从CSS属性命中去除，然后将横杠后的第一个字母大写；

② CSS属性名是JavaScript保留字的，需要在属性名之前加“css”字符串前缀；

③ style对象的属性值都是字符串，包括计量单位

style属性的cssText用法
style对象的 cssText属性可以用来直接读、写、删整个 style属性

语法：元素节点 .style .cssText=' 样式 ';

<script>
    var newElem=document.createElement('p');                        //创建<p>标签
    var elemText=document.createTextNode('祝天下单身狗情人节快乐！');   //创建元素内容节点
    newElem.appendChild(elemText);                          //将内容节点添加给<p>标签
    newElem.style.cssText='text-align:center;color:blue;font-size:25px;border-bottom:2px solid darkgreen';
    document.body.appendChild(newElem);                              //将<p>标签添加到页面body中
</script>

删除整个style属性可以使用<元素节点 .cssText=' ' >这种方式
cssText对应的是HTML元素的style属性，所以在书写时不需要改写属性名

style属性方法
style对象提供了三种方法分别读、写、删行内样式

① setProperty()，设置样式，语法：元素节点 .style .setProperty(' propertyName ' , ' value ');

② getPropertyValue()，获取样式，语法：元素节点 .style .getPropertyValue(' propertyName ');

③ removeProperty()，删除样式，语法：元素节点 .style .removeProperty(' propertyName ');

<script>
    var newElem=document.createElement('p');                        //创建<p>标签
    var elemText=document.createTextNode('祝天下单身狗情人节快乐！');   //创建元素内容节点
    newElem.appendChild(elemText);                        //将内容节点添加给<p>标签
    var elemStyle=newElem.style;
    elemStyle.setProperty('text-align','center');
    var queryRes=elemStyle.getPropertyValue('text-align');
    console.log(queryRes);
    elemStyle.removeProperty('text-align');
    document.body.appendChild(newElem);                            //将<p>标签添加到页面body中
</script>

四，举例应用

获取HTML元素对象

直接获取方式：通过id、通过name属性值、通过标签名、通过class属性值；
间接获取方式：父子关系、子父关系、兄弟关系；

1，getElementById(id)

<body> 
<div id=’divid’><p>h</p> 
Just for testing; 
</div> 
<div id=’divid’> 
Just for testing; 
</div> 
<script> 
var div=document.getElementById(‘divid’); 
alert(div.nodeName);
</script> 
</body>

2、getElementsByName(name)

<body> 
<div name="george">f</div> 
<div name="george">f</div> 
<script type="text/javascript"> 
var georges=document.getElementsByName("george"); 
alert(georges.length); 
</script> 
</body>

3、getElementsByTagName(tagname)
getElementByTagName可以用于DOCUMENT也可以用元素。getElementsByTagName返回具有指定tagname的子元素列表（数组）。你可以遍历这个数组获得每一个单独的子元素。当处理很大的`DOM结构，使用这种方法可以很容易的所有缩小范围。

<html> 
<head> 
<title></title> 
<script> 
    function start() { 
        // 获得所有tagName是body的元素（当然每个页面只有一个）          
       myDocumentElements=document.getElementsByTagName("body"); 
       myBody=myDocumentElements.item(0); 
        // 获得body子元素种的所有P元素 
        myBodyElements=myBody.getElementsByTagName("p");
        // 获得第二个P元素
        myP=myBodyElements.item(1); 
       //显示这个元素的文本 
        alert(myP.firstChild.nodeValue); 
    } 
</script> 
</head> 
<body onload="start()"> 
<p>hi</p> 
<p>hello</p> 
</body> 
</html>

4，appendChild(node)
向当前节点对象的追加节点。经常用于给页面动态的添加内容。
例如下面给div添加一个文本节点：

<div id="test"></div>
<script type="text/javascript">
var newdiv=document.createElement("div")
var newtext=document.createTextNode("A new div")
newdiv.appendChild(newtext)
document.getElementById("test").appendChild(newdiv)
</script>

上面的例子中给DIV添加文本，也可以用newdiv.innerHTML=”A new div”实现，不过innerHTML不属于DOM

5，removeChild(childreference)
移除当前节点的子节点，返回被移除的节点。这个被移除的节点可以被插入document树中别的地方

<div id="father"><div id="child">A child</div></div>
<script type="text/javascript">
var childnode=document.getElementById("child")
var removednode=document.getElementById("father").removeChild(childnode)
</script>

6，cloneNode(deepBoolean)
复制并返回当前节点的复制节点，这个复制得到的节点是一个孤立的节点，不在document树中。复制原来节点的属性值，包括ID属性，所以在把这个新节点加到document之前，一定要修改ID属性，以便使它保持唯一。当然如果ID的唯一性不重要可以不做处理。

这个方法支持一个布尔参数，当deepBoolean设置true时，复制当前节点的所有子节点，包括该节点内的文本。

<p id=”mypara”>11111</p>
p=document.getElementById("mypara")
pclone = p.cloneNode(true);
p.parentNode.appendChild(pclone);

7，replaceChild(newChild, oldChild)
把当前节点的一个子节点换成另一个节点
例如：

<div id="adiv"><span id="innerspan">span</span></div>
<script type="text/javascript">
var oldel=document.getElementById("innerspan");
var newel=document.createElement("p");
var text=document.createTextNode(“ppppp”);
newel.appendChild(text);
document.getElementById("adiv").replaceChild(newel, oldel);
</script>

8，insertBefore(newElement, targetElement)
给当前节点插入一个新节点，如果targetElement被设置为null，那新节点被当作最后一个子节点插入，否则那新节点应该被插入targetElement之前的最近位置。

<body>
<span id="lovespan">熊掌我所欲也!</span>
</body>

<script type="text/javascript">
var lovespan=document.getElementById("lovespan")
var newspan=document.createElement("span")
var newspanref=document.body.insertBefore(newspan, lovespan)
newspanref.innerHTML="鱼与";
</script>

9，click()
执行元素的一次点击，可以用于通过脚本来触发onClick函数

<script>
function wow() {
alert("我好象没有点鼠标啊");
}
</script>

<div id="test" onclick='wow()'>hhh</div>
<script type="text/javascript">
var div = document.getElementById("test");
div.click();
</script>

操作HTML元素对象的属性

获取：
--元素对象名.属性名//返回当前属性的属性值。---------固有
--元素对象名.getAttribute("属性名");//返回自定义属性的值---------自定义
修改：
--元素对象名.属性名=属性值
--对象名.setAttribute("属性名","属性值");//修改自定义属性的值-------自定义
注意：
--尽量的不要去修改元素的id值和name属性值。
使用自定义方式获取固有属性内容，value的值获取的是默认值，不能够获取实时的用户数据。

操作HTML元素对象的内容和样式

获取元素对象
获取：
--元素对象名.innerHTML//返回当前元素的所有内容，包括HTML标签
--元素对象名.innerHTML//返回当前元素对象的文本内容，不包括HTML标签
修改：
--元素对象名.innerHTML="新的值"//会将原有内容覆盖，并HTML标签会解析
--元素对象名.innerHTML=元素对象名.innerHTML+"新的值"//追加效果
--元素对象名.innerText="新的值"//会将原有内容覆盖，但HTML标签不会被解析，会作为普通文本显示。

js操作元素样式

获取元素对象
-通过style属性
--元素对象名.style.样式名="样式值"//添加或者修改
--元素对象名.style.样式名=“”//删除样式
注意：以上操作的是HTML的style属性声明中的样式。而不是其他css代码域中的样式
-通过className
--元素对象名.className="新的值"--添加类选择器样式或者修改类选择器样式
--元素对象名.className=""//删除类样式

document.getElementById("test").style.backgroundColor="yellow"

firstChild 返回第一个子节点

lastChild 返回最后一个子节点

parentNode 返回父节点的对象。

nextSibling 返回下一个兄弟节点的对象

previousSibling 返回前一个兄弟节点的对象

nodeName 返回节点的HTML标记名称，使用英文的大写字母，如P, FONT

例如

<div id='test'>ddd</div>

<script>

if (document.getElementById("test").nodeName=="DIV")

   alert("This is a DIV");

</script>

第一个例子：
使用DOM1.0 的javascript动态地创建一个HTML table。

<head>

<title>Sample code </title>

<script>

    function start() {

        //获得body的引用

        var mybody=document.getElementsByTagName("body").item(0);

        //创建一个<table></table>元素

        mytable = document.createElement("TABLE");

        //创建一个<TBODY></TBODY>元素

        mytablebody = document.createElement("TBODY");

        // 创建行列

        for(j=0;j<3;j++) {

//创建一个<TR></TR>元素

            mycurrent_row=document.createElement("TR");

            for(i=0;i<3;i++) {

    //创建一个<TD></TD>元素

                mycurrent_cell=document.createElement("TD");

//创建一个文本元素

                currenttext=document.createTextNode("cell is row "+j+", column "+i);

                //把新的文本元素添加到单元TD上

                mycurrent_cell.appendChild(currenttext);

                // appends the cell TD into the row TR

                //把单元TD添加到行TR上
                mycurrent_row.appendChild(mycurrent_cell);

            }

//把行TR添加到TBODY上

            mytablebody.appendChild(mycurrent_row);

        }

        // 把 TBODY 添加到 TABLE

        mytable.appendChild(mytablebody);

        // 把 TABLE 添加到 BODY

        mybody.appendChild(mytable);

        // 把mytable的border 属性设置为2

        mytable.setAttribute("border","2");

    }

</script>

</head>

<body onload="start()">

</body>

</html>

操作HTML的文档结构

增加结点
删除结点
第一种方式：使用innerHTML
div.innerHTML=div.innerHTML+"内容"//增加节点
div.innerHTML=""//删除所有子节点
父节点.removeChild(子节点对象)//删除指定的子节点

这是一个事实上的标准，不属于w3c DOM，但是几乎所有支持DOM的浏览器，都支持这个属性。通过这个属性我们很容易修改一个元素的HTML。

<p><b>新人类，什么？！</b></p>
<script type="text/javascript">
window.onload=function(){
document.getElementsByTagName("p")[0].innerHTML="<b>新新人类，什么？！</b>"

}
</script>

获取元素对象
var obj=document.createElement("标签名");
元素对象名.appendChild(obj);

function testOper2(){
//获取元素对象
var showdiv=document.getElementById("showdiv");
//创建input元素对象
var inp=document.createElement("input");
inp.type="file";
//创建按钮元素对象
var btn=document.createElement("input");
btn.type="button";
btn.value="删除";
btn.onclick=function(inp);
    showdiv.removeChild(inp);
    showdiv.removeChild(btn);
    showdiv.removeChild(br);
//创建换行符
var br=document.createElement("br");
//将创建的元素对象存放在div中
showdiv.appendChild(inp);
showdiv.appendChild(btn);
showdiv.appendChild(br);
}

document操作Form元素

获取form表单对象
        使用id：var fm=document.getElementById("fm");
        使用name属性：var frm=document.frm;
获取form下的所有表单元素对象集合
        fm.elements
form表单的常用方法
        表单对象.submit();//提交表单数据
form的属性操作：
        表单对象名.action="新的值"//动态的改变数据的提交路径
        表单对象名.method="新的值"//动态的改变提交方式

js表单元素的通用属性
    只读模式：
            readonly="readonly"//不可以更改。但是数据可以提交
    关闭模式：
            disabled="disabled"//不可以进行任何操作，数据无法进行提交

js操作多选框、单选框
–被选中状态下在js中checked属性值为true，未选中状态为false；
js操作下拉框：
–被选择的option对象在js之中selected属性值为true，未选中为false

function Form(){
    //获取form表对象
    var fm=document.getElementById("fm");
    alert(fm);
    //使用form表单的name属性值来获取
    var frm=document.frm;
    alert(frm);
}

document操作表格

删除行：
        行对象.rewIndex//返回行对象的脚标
        表格对象.deleteRow(要删除的行对象的脚标)

1、childeNodes 返回所有子节点对象,
例如

<table id="mylist">
<tr><td>一个和尚有水喝。</td></tr>
<tr><td>两个和尚挑水喝。</td></tr>
<tr><td>三个和尚没水喝。</td></tr>
</table>

<script>
var msg=””
var mylist=document.getElementById("mylist")

for (i=0; i<mylist.childNodes.length; i++){
   var tr=mylist.childNodes[i];

   for(j=0;j<tr.childNodes[j].length; j++) {
     var td=tr.childNodes[j];
      msg+=td.innerText;
   }
}

alert(msg);

</script>

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 217,734评论 6赞 505
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 92,931评论 3赞 394
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 164,133评论 0赞 354
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 58,532评论 1赞 293
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 67,585评论 6赞 392
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 51,462评论 1赞 302
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 40,262评论 3赞 418
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 39,153评论 0赞 276
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 45,587评论 1赞 314
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 37,792评论 3赞 336
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 39,919评论 1赞 348
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 35,635评论 5赞 345
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 41,237评论 3赞 329
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 31,855评论 0赞 22
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 32,983评论 1赞 269
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 48,048评论 3赞 370
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 44,864评论 2赞 354

JavaScript的document对象