当前位置： 文江博客文章教程详情

JavaScript 及 jQuery 中的各种宽高属性图解

发布于 2024-06-21 06:02:42 字数 23543 浏览 17 评论 0

强烈建议打开控制台自己动手练习一遍，这样印象才会深刻。

第一部分 JavaScript 中的宽高属性

一、与 window 相关的宽高属性

1.1 window.location 和 document.location

  • window 对象的 location 属性引用的是 location 对象，表示该窗口中当前显示文档的 URL
  • document 的对象的 location 属性也是引用 location 对象
  • 所以 window.location === document.location //true

    1.2 window.screen

  • window.screen 包含有关用户屏幕的信息。它包括：
    • window.screen.width
    • window.screen.height
    • window.screen.availHeight
    • window.screen.availWidth
    • window.screenTop
    • window.screenLeft

window.screen

1.3 与 window 相关的宽高

  • window.innerWidth 内部的宽度
  • window.innerHeight 内部的高度
  • window.outWidth 外部的宽度
  • window.outHeight 外部的高度

与 window 相关的宽高

二、与 document 相关的宽高属性

2.1 与 client 相关的宽高

  • document.body.clientWidth 元素宽度（可视内容区+内边距）
  • document.body.clientHeight 元素高度（可视内容区+内边距）

该属性指的是元素的可视部分宽度和高度，即 padding+content
如果没有滚动条，即为元素设定的宽度和高度
如果出现滚动条，滚动条会遮盖元素的宽高，那么该属性就是其本来宽高减去滚动条的宽高

example1：

body{ 
    border: 20px solid #000; 
    margin: 10px; 
    padding: 40px; 
    background: #eee; 
    height: 350px; 
    width: 500px; 
    overflow: scroll; 
} 
console.log(document.body.clientWidth);  // 350+padding(80) = 430
console.log(document.body.clientHeight);  // 500 + padding(80) = 580

example2: 在 div 中添加文字， 指导出现滚动条

#exp2 {
width:200px;
height:200px;
background:red;
border:1px solid #000;
overflow:auto;
}

var test = document.getElementById("exp2");

console,log(test.clientHeight); // 200
console.log(test.clientWidth); //

  • 小结 clientWidth 和 clientHeight
    • 无 padding 无滚动 ： clientWidth = 盒子的 width
    • 有 padding 无滚动 ： clientWidth = 盒子的 width + 盒子的 padding * 2
    • 有 padding 有滚动 ： clientWidth = 盒子和 width + 盒子的 padding * 2 - 滚动轴宽度
  • document.body.clientLeft
  • document.body.clientTop

这两个返回的是元素周围边框的厚度，如果不指定一个边框或者不定位该元素，它的值就是 0

例：

body{ 
    border: 20px solid #000; 
    margin: 10px; 
    padding: 40px; 
    background: #eee; 
    height: 350px; 
    width: 500px; 
    overflow: scroll; 
} 
console.log(document.body.clientLeft);  // 20
console.log(document.body.clientTop);  // 20

小结 clientLeft 和 clientTop

  • 这一对属性是用来读取元素的 border 的宽度和高度的
    • clientTop = border-top
    • clientLeft = border-left

2.2 与 offset 相关的宽高

  • document.body.offsetWidth（元素的 border+padding+content 的宽度）
  • document.body.offsetHeight（元素的 border+padding+content 的高度）

该属性和其内部的内容是否超出元素大小无关，只和本来设定的 border 以及 width 和 height 有关

例：

body{ 
    border: 20px solid #000; 
    margin: 10px; 
    padding: 40px; 
    background: #eee; 
    height: 350px; 
    width: 500px; 
    overflow: scroll; 
} 
console.log(document.body.offsetWidth);  // 470 = padding*2 + 350 + border*2
console.log(document.body.offsetHeight);  // 620 = padding*2 + 500 + border*2

小结 offsetWidth 和 offsetHeight

  • 无 padding 无滚动无 border
    • offsetWidth = clientWidth = 盒子的宽度
  • 有 padding 无滚动有 border
    • offsetWidth = 盒子的宽度 + 盒子 padding2 + 盒子边框2 = clientWidth + 边框宽度*2
  • 有 padding 有滚动，且滚动是显示的，有 border
    • offsetWidth = 盒子宽度 + 盒子 padding2 + 盒子边框2 = clientWidth + 滚动轴宽度 + 边框宽度*2
  • document.offsetLeft
  • document.offsetTop

了解这两个属性我们必须先了解它，什么是 offsetParent

  • 如果当前元素的父级元素没有进行 CSS 定位（ position 为 absolute 或 relative ）, offsetParent 为 body.
  • 假如当前元素的父级元素中有 CSS 定位， offsetParent 取最近的那个父级元素

offsetLeft 的兼容性问题：

  • 在 IE6/7 中
    • offsetLeft = offsetParent 的 padding-left + 当前元素的 margin-left
  • 在 IE8/9/10 以及 chrome 中
    • offsetLeft = offsetParent 的 margin-left + offsetParent 的 border 宽度 + offsetParent 的 padding-left + 当前元素的 margin-left
  • 在 FireFox 中
    • offsetLeft = offsetParent 的 margin-left + 当前元素的 margin-left + offsetParent 的 padding-left

例：

body{ 
    border: 20px solid #000; 
    margin: 10px; 
    padding: 40px; 
    background: #eee; 
    height: 350px; 
    width: 500px; 
    overflow: scroll; 
} 

#exp {
   width:400px;
   height:200px;
   padding:20px;
   margin:10px;
   background:red;
   border:20px solid #000;
   overflow:auto;
}
var div = document.getElementById("exp");
  • 在 IE8/9/10 以及 chrome 中：
    • div.offsetLeft = 本身的 margin10 + 父级元素的 padding40 + margin10 + border20 = 80
    • div.offsetTop = 本身的 margin10 + 父级元素的 padding40 + margin10 + border20 = 80
  • 在 FireFox：（相比 chrome 中少了 border）
    • div.offsetLeft = 本身的 margin10 + 父级元素的 padding40 + margin10 = 60
    • div.offsetTop = 本身的 margin10 + 父级元素的 padding40 + margin10 = 60
  • 在 IE6/7 中：（相比在 FireFox，不但少了 border 还少了父级元素的 margin）
    • div.offsetLeft = 本身的 margin10 + 父级元素的 padding40 = 50
    • div.offsetTop = 本身的 margin10 + 父级元素的 padding40 = 50

2.3 与 scroll 相关的宽高 (实际项目中用的最多)

  • document.body.scrollWidth
  • document.body.scrollHeight

document.body 的 scrollWidth 和 scrollHeight 与 div 的 scrollWidth 和 scrollHeight 是有区别的

例：

body{ 
    border: 20px solid #000; 
    margin: 10px; 
    padding: 40px; 
    background: #eee; 
    height: 350px; 
    width: 500px; 
    overflow: scroll; 
}

document.body.scrollHeight; // 
document.body.scrollWidth; //
  • 当给定宽高小于浏览器窗口的宽高
    • scrollWidth = 通常是浏览器窗口的宽度
    • scrollHeight = 通常是浏览器窗口的高度
  • 当给定宽高大于浏览器窗口的宽高，且内容小于给定宽高的时候
    • scrollWidth = 给定宽度 + 其所有的 padding + margin + border
    • scrollHeight = 给定高度 + 其所有的 padding + margin + border
  • 当给定宽高大于浏览器窗口宽高，且内容大于给定宽高
    • scrollWidth = 内容宽度 + 其所有的 padding + margin + border
    • scrollHeight = 内容高度 + 其所有的 padding + margin + border

在某 div 中的 scrollWidth 和 scrollHeight

  • 无滚动轴时：
    • scrollWidth = clientWidth = 盒子宽度 + 盒子 padding*2

  • 有滚动轴时：
    • scrollWidth = 实际内容的宽度 + padding*2
    • scrollHeight = 实际内容的高度 + padding*2

  • document.body.scrollLeft
  • document.body.scrollTop

与前面不同的是，这对属性是可读写的，指的是当元素其中的超出其宽高的时候，元素被卷起来的高度和宽度

#exp {
   width:400px;
   height:200px;
   padding:20px;
   margin:10px;
   background:red;
   border:20px solid #000;
   overflow-y:scroll;
}

var mydiv = document.getElementById("exp");

mydiv.scrollTop ;  //默认情况下是 0 
mydiv.scrollLeft ; //默认情况下是 0 

//可以改写它

mydiv.scrollTop = 20;
console.log(mydiv.scrollTop)

obj.style.width 和 obj.style.height

对于一个 DOM 元素，它的 style 属性返回的是一个对象，这个对象的任意一个属性是可读写的， style.width 等于 css 属性中的宽度。 style.height 等于 css 属性中的高度

2.4 documentElement 和 body 的关系

是父子级的关系

body{ 
    border: 20px solid #000; 
    margin: 10px; 
    padding: 40px; 
    background: #eee; 
    height: 350px; 
    width: 500px; 
    overflow: scroll; 
}

#exp {
   width:400px;
   height:200px;
   padding:20px;
   margin:10px;
   background:red;
   border:20px solid #000;
   overflow-y:scroll;
}

console.log(document); //document
console.log(document.documentElement); //html
console.log(document.body); //body

  • 兼容问题推荐使用 获取浏览器窗口可视区域大小
document.body.clientWidth || document.documentElement.clientWidth;
document.body.clientHeight || document.documentElement.clientHeight;

三、Event 对象的 5 种坐标

例：

<div id="example" 
style="width: 200px;height: 200px;background: red;margin: 100px auto;"></div>
var example = document.getElementById("example");
example.onclick = function(e){
console.log("clientX "+e.clientX + " : " + " clientY "+e.clientY);
console.log("screenX "+e.screenX + " : " + " screenY "+e.screenY);
console.log("offsetX "+e.offsetX + " : " + " offsetY "+e.offsetY);
console.log("pageX "+e.pageX + " : " + " pageY "+e.pageY);
console.log("x "+e.x + " : " + " y "+e.y);
}

四、JS 各种宽高的应用

example1：可视区域加载

<div id="example1" ></div>
#example1 {
width: 500px;
height: 350px;
background: red;
margin: 1000px auto 0 auto;
}
@-webkit-keyframes fadeInLeft{
0%{
opacity: 0;
transform: translate3d(-100%,0,0);
}
100%{
opacity: 1;
transform: none;

}
}
.fadeInLeft {
animation-name: fadeInLeft;
animation-duration: 2s;
}
function showDiv(){
var example = document.getElementById("example");
var clients = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;//可视区域的高度
var divTop = example.getBoundingClientRect().top;
if(divTop <= clients){
example.classList.add("fadeInLeft");
                              //  这里可以通过 setAttribute 设置图片的 src 按需加载
}
document.title = clients+"---"+divTop;
}

window.onscroll = showDiv;

在线演示

example2：网页滚动到顶部或者底部

<div id="example2" ></div>
#example2 {
width: 500px;
height: 350px;
background: red;
margin: 1000px auto 0 auto;
}
function scrollTopOrBottom(){
var example2 = document.getElementById("example");
var clients = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;//可视区域的高度，兼容性写法
var scrollTop = document.body.scrollTop;
var wholeHeight = document.body.scrollHeight;
if(clients + scrollTop >= wholeHeight){
alert("我已经到了底部!");
                              // 这里可以调用 Ajax 分页加载到页面中，实现多页加载功能
}else if(scrollTop == 0){
alert("我已经到了顶部了!");
                      
}
document.title = (clients + scrollTop)+"---"+wholeHeight+"--"+scrollTop;
}

window.onscroll = scrollTopOrBottom;

在线演示

example3：DIV 滚动到底部加载

<div id="example3" >
DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载
DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载
DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载
DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载
DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载
DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载 DIV 滚动到底部加载
</div>
#example3 {
width: 500px;
height: 400px;
background: red;
margin: 10px auto;
padding: 10px;
overflow-y: scroll;
}
var div = document.getElementById("example3");
function divScroll(){

var wholeHeight = div.scrollHeight;//滚动区域高度
var divScrollTop = div.scrollTop;//卷上去的那部分高度
var divHeight = div.clientHeight; //div 的可视区域的高度


if(divScrollTop + divHeight >= wholeHeight){
alert("我已经到了底部!");
               // 这里可以在 div 中通过滚动加载分页按需显示
}else if(divScrollTop == 0){
alert("我已经到了顶部了!");
}
document.title = (divScrollTop + divHeight)+"---"+wholeHeight+"--"+divScrollTop;
}

div.onscroll = divScroll;

在线演示

example4：计算滚动轴的宽度

//获取滚动轴的宽度
function getScrollBar(){
var el = document.createElement("p");
var styles = {
width:"100px",
height:"100px",
overflowY:"scroll"
};
for (var prop in styles){
el.style[prop] = styles[prop];//把 styles 上的属性全部遍历拷贝到 el.style 上

}
document.body.appendChild(el);
var scrollBarWidth = el.offsetWidth - el.clientWidth;
el.remove();
return scrollBarWidth;
}
alert(getScrollBar());//17

在线演示

五、js 中的宽高属性总结

第二部分 jQuery 中的宽高属性

一、jquery 相关宽高介绍

  • 1.1 width()
    • 特殊元素 window.document 只可以读，普通元素可以读写， width() 返回结果无单位， css("width") 的结果有单位

  • 1.2 innerWidth()
    • 包含 padding（不推荐 window,document 调用）
  • 1.3 innerHeight()

  • 1.4 outerWidth()
    • 包含 padding 和 border，当传 true 时包含 marging，不传时不包含 marging（不推荐 window,document 调用）
  • 1.5 outerHeight()

  • 1.6 scrollLeft():
    • 相对于水平滚动条左边的距离，如果滚动条非常左、或者元素不能被滚动，这个值为 0；
  • 1.7 scrollTop():
    • 相对于垂直滚动条上边的距离，如果滚动条非常上、或者元素不能被滚动，这个值为 0；
  • 1.8 .offset():
    • 相对于 document 的当前坐标值（相对于 body 左上角的 left,top 的值)；
  • 1.9 .position():
    • 相对于 offset parent 的当前坐标值（相对于 offset parent 元素的左上角的 left、top 的值)

二、jQuery 相关宽高举例

2.1 exmaple1

<div class="parentDiv">
<div class="childrenDiv"></div>
</div>
html,body {
margin:10px;
border:5px solid red;
padding:20px;
}
.parentDiv {
width:800px;
height:500px;
margin:5px auto;
background:#FF6600;
border:5px dashed green;padding:30px;position:relative;

}
.childrenDiv {
width:300px;
height:500px;
margin:5px auto;
background:yellow;
border:5px solid black;
padding:5px;
box-sizing:border-box;/*包括 padding 和 border 的值*/
}
//特殊元素的高度
//window  document
console.log("$(window).height()"+$(window).height());
console.log("$(document).height()"+$(document).height());

//innerHeight 
console.log("$(window).innerHeight()"+$(window).innerHeight());
console.log("$(document).innerHeight()"+$(document).innerHeight());

//普通 child 元素的高度

//480 = 500 - border*2 - padding*2 (因为设置了 box-sizing，box-sizing 把 border 和 padding 的值计算了进去)
console.log('$(".childrenDiv").height()'+ $(".childrenDiv").height());

//490 = 500 - border*2 - padding*2（innerHeight 不包括 padding）
console.log('$(".childrenDiv").innerHeight()'+ $(".childrenDiv").innerHeight());

//500 = 500  不包括 margin
console.log('$(".childrenDiv").outerHeight()'+ $(".childrenDiv").outerHeight());

//510 = 500 + margin true 包括 margin
console.log('$(".childrenDiv").outerHeight()'+ $(".childrenDiv").outerHeight(true));

//scrollTop

$(window).scroll(function(){
document.title = "scrollTop  "+$(this).scrollTop();
});

// jquery 宽高演示之 offset 和 position

console.log('$(".childrenDiv").offset().top '+$(".childrenDiv").offset().top);
console.log('$(".childrenDiv").offset().left '+$(".childrenDiv").offset().left);
console.log('$(".childrenDiv").position().top '+$(".childrenDiv").position().top);
console.log('$(".childrenDiv").position().top '+$(".childrenDiv").position().left);

在线演示

三、jQuery 各种宽高应用

3.1 jQuery 可视区域加载

<div id="example" ></div>
#example {
width: 500px;
height: 350px;
background: red;
margin: 1000px auto 0 auto;
}
@-webkit-keyframes fadeInLeft{
0%{
opacity: 0;
transform: translate3d(-100%,0,0);
}
100%{
opacity: 1;
transform: none;

}
}
.fadeInLeft {
animation-name: fadeInLeft;
animation-duration: 2s;
}
$(window).scroll(function(){
var ks_area = $(window).height();//可视区域高度
var scrollHeight = $(window).scrollTop();//被卷上去的那部分
var divTop = $("#example").offset().top;//盒子距离浏览器顶部的距离

if(ks_area + scrollHeight >= divTop){
$("#example").addClass("fadeInLeft");
}
document.title = ks_area+'-'+scrollHeight+'-'+divTop;
});

3.2 jquery 滚动到底部和顶部加载

<div id="example" ></div>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
#example {
width: 500px;
height: 350px;
background: red;
margin: 1000px auto 0 auto;
}
$(window).scroll(function(){
var ks_area = $(window).height();
var scrollTop = $(window).scrollTop();
var wholeHeight = $(document).height();

if(ks_area + scrollTop >=wholeHeight ){
alert("已经到底部了");
}else if(scrollTop == 0){
alert("已经到头部了");
}
})

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群
更多

你可能也喜欢

创建 Docker Swarm 集群

重建 CentOS 或 RHEL 上被损坏的 RPM 数据库

如何退出无响应的 ssh 会话

Maven 中 optional 关键字

Android 的系统架构

使用 SASS 预处理器管理你的 CSS 代码

Sass Guidelines 中文版本之 循环、排错和工具

再谈等高列布局、水平垂直居中与置顶页脚

上一篇：

下一篇：

发布评论

需要 登录 才能够评论， 你可以免费 注册 一个本站的账号。
列表为空，暂无数据

关于作者

在巴黎塔顶看东京樱花

暂无简介

0 文章
0 评论
23 人气
发私信
更多

热门标签

操作系统 程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端
更多

推荐作者

玍銹的英雄夢

文章 0 评论 0

我不会写诗

文章 0 评论 0

十六岁半

文章 0 评论 0

浸婚纱

文章 0 评论 0

qq_kJ6XkX

文章 0 评论 0

旧伤还要旧人安

文章 0 评论 0

更多

友情链接

文江博客
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。
    原文