对于单文本或者div的内容怎么在显示东西过多的情况下实现显示隐藏
js代码:
$(function () {
var o = document.getElementById("newsdetail_ArticleContent");
Subt(o);
});
function Subt(obj) {
var s = obj.innerHTML;
var p = document.createElement("span");
var n = document.createElement("a");
p.innerHTML = s.substring(0, 1100);
n.innerHTML = s.length > 1100 ? "查看更多" : "";
n.href = "javascript:void(0);";
n.className = 'c00aeff fs16';
n.onclick = function () {
if (n.innerHTML == "查看更多") {
n.innerHTML="点击隐藏";
p.innerHTML = s;
} else {
n.innerHTML = "查看更多";
p.innerHTML = s.substring(0, 1100);
}
}
obj.innerHTML = "";
obj.appendChild(p);
obj.appendChild(n);
}
html代码结构
<div id="newsdetail_ArticleContent" class="c666666 lh30 pl30 pr30 pt20 pb20" style="font-family: '黑体';"><span><span><p style="text-indent:2em;">
</span></span></div>
这样就实现了js控制单文本内容过多的显示隐藏问题
对于单文本或者div的内容怎么在显示东西过多的情况下实现显示隐藏的更多相关文章
- div样式text-align在子元素缩进不规范的情况下,chrome出现的问题(貌似结果是inline-block导致的)
在调css的时候,发现居然有firefox实现效果完整而chrome出现问题的情况: 详细情况:segmentfault1 segmentfault2 全文表达: <html><he ...
- span标签里的内容在IE下显示,而在谷歌浏览器下不显示
有如下代码: <span id="spLicenseIncrease" style="color:red;">(51)</span> 在 ...
- HTML中让表单input等文本框为只读不可编辑但可以获取value值的方法;让文本域前面的内容显示在左上角,居中
HTML中让表单input等文本框为只读不可编辑的方法 有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使input text的内容,中国两个字不可以修改 有时候,我们希望 ...
- 修改placeholder提示内容的颜色以及文本框输入文字内容的颜色
一般表单文本框提示信息:placeholder=" ",默认颜色是灰色的,输入文本信息也是默认为黑色的,如图所示: 修改placeholder提示内容的颜色关键代码及实现: 实现输 ...
- DEV中dx:ASPxPopupControl 控件的使用(在窗口关闭或隐藏时,清楚文本框中的内容)
//在窗口关闭或隐藏时,清楚文本框中的内容(核心代码) function(s, e) { ASPxClientEdit.ClearGroup('entryGroup'); } <asp:Cont ...
- 使用WebBrowser控件时在网页元素上绘制文本或其他自定义内容
原文:使用WebBrowser控件时在网页元素上绘制文本或其他自定义内容 第一次在CNBlogs上发Post是提出一个有关使用WebBrowser控件时对SELECT网页元素操作的疑惑,这个问题至今也 ...
- css 文本和div垂直居中方法汇总
https://blog.csdn.net/u014607184/article/details/51820508 https://blog.csdn.net/liuying1802028915/ar ...
- DIV的内容自动换行
word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行. 它们的区别就在于: 1,word-break:break-all 例如div宽 ...
- select()事件默认选中文本框的全部内容,并改变其背景色和文字颜色
1.select()事件默认选中文本框的全部内容 拿到input标签的节点,调用select()方法即可.但是我做的vue项目中调用了此方法有一个bug,单次点击会全选内容,双次点击的时候全选会闪一下 ...
随机推荐
- 设计模式之复合模式(Compound Pattern)
一.什么是复合模式? 在形式上,复合模式确实是多个模式的组合,但满足了这一条并不一定是复合模式,注意它的定义: 将多个模式结合起来形成一个“框架”,以解决一般性问题 一提到“框架”,可能最容易联想到的 ...
- UWP开发入门(六)——对多设备不同分辨率显示效果的讨论
本篇不涉及具体代码,而是把实际开发UWP APP的过程中,遇到的不同设备,不同分辨率显示效果差异的问题进行讨论.希望能够抛砖引玉,和各位擦出一些火花. 蜀黍我目前是在做一套牛逼的UWP APP啦,目标 ...
- 基于JMS的ActiveMQ搭建与实现
1.JMS Java消息服务(Java Message Service)即JMS,是一个Java平台中关于面向消息中间件的API,用于两个程序之间,或分布式系统中发送消息,进行异步通信. JMS包括队 ...
- linux常用命令大全(linux基础命令入门到精通+命令备忘录+面试复习+实例)
作者:蓝藻(罗蓝国度) 创建时间:2018.7.3 编辑时间:2019.4.29 前言 本文特点 授之以渔:了解命令学习方法.用途:不再死记硬背,拒绝漫无目的: 准确无误:所有命令执行通过(环境为ce ...
- Mac OS 10.12 - 安装Homebrew,像Ubuntu里面的apt一样简单地安装和删除软件!
Homebrew — macOS 不可或缺的套件管理器,Homebrew官方网站如此介绍自己!!! 中文官网:https://brew.sh/index_zh-cn.html 一,安装 打开shell ...
- leetcode 90. 子集 II JAVA
题目: 给定一个可能包含重复元素的整数数组 nums,返回该数组所有可能的子集(幂集). 说明:解集不能包含重复的子集. 示例: 输入: [1,2,2] 输出: [ [2], [1], [1,2,2] ...
- python 进程、线程、协程感悟
进程: 感觉只是使用Process模块加以使用即可: # -*- coding: utf-8 -*- # data:2019-02-23 21:23 # user:DIY # file:thread_ ...
- umeng推送, 生产环境deviceToken失效可能原因
1 在系统升级之后会造成app的deviceToken重置(一定). 2 在app卸载之后可能会造成app的deviceToken重置. 3 deviceToken重置使用umeng推送时会因为dev ...
- mybatis中单个参数的引用
单个参数时在test条件中不能用参数名来引用,可以使用_parameter
- Flask从入门到精通之Flask表单渲染成HTML
表单字段是可调用的,在模板中调用后会渲染成HTML.假设视图函数把一个NameForm 实例通过参数form 传入模板,在模板中可以生成一个简单的表单,如下所示: <form method=&q ...